事情起因
插件的开发
大约半年前,我写了一个VS Code插件,叫character-conversion,我的开发初衷是为了将=>这样的连在一起字符在外观上替换成⇒这样的单个箭头符号,达到和连字体(免费连字体哪家强?最全连字体盘点)类似的效果。
没花多少工夫,我就把功能完成了,效果大致如下:
虽然效果比连字体要稍差一些,但也有一个好处,那就是可以自定义箭头样式,甚至可以是emoji:
为了功能更加通用,通过添加自定义配置项,还可以将任意字符在替换成其他任意字符,所以我才将插件取名为Character Conversion,并最终将其发布至插件市场。
完成以后,我就没再管过这个插件了,也没指望会有人用。
事实也正是如此,过去半年,下载量也没有超过300次。
一个issue引发的思考
但没想到的是,前几天我收到了一个issue:How do I disable some convertions? · Issue #1
插件默认提供了对四个字符的转换:=>、>=、!=、<=,有人提问说能不能只替换箭头,禁用其他三个。
由于我当时纯粹是闲着无聊才写了这个插件,没考虑过这个问题,但既然有需求,而且问题也不难搞定,所以还是帮解决一下吧。
同时我也说了,我原本是没打算继续维护这个插件的,建议对方最好使用含有连字符的字体。
但对方却表示很喜欢这个插件,没有担心过这个问题。
虽然有点疑惑,但我也没好意思继续问对方为什么喜欢,说不定人家就是客气一下呢?
所以,我决定自己摸索一下它是不是有什么其他的作用。
我自己都没想到的玩法
折叠HTML内联属性
折叠内联属性在使用TailwindCSS、UnoCSS之类的CSS原子类时非常有用,虽然也有其他插件能做到类似的效果,但在此之前我完全没想过这个插件也能这么用。
效果如下:
只需在settigns.json中添加配置:
"characterConversion.rules": [
[
".+?=\\\"([^\\\"\\n]{20,}?)\\\"",
"◦◦◦",
1
]
],
配置项是一个二维数组,每个数组有三项,第一项是匹配的正则表达式,第二项是替换后的字符,第三项是可选的正则表达式Group,默认值是0。
这里的意思就是当HTML属性的字符数超过20个,就将内容折叠为三个点,注意引号要用\转义,而\本身也需要转义,所以\"就得写成\\\"。
标记特殊的单词
例如,在所有的TODO前添加一个感叹号
"characterConversion.rules": [
[
"TODO",
"⚠️TODO"
]
],
单个字符替换
例如,所有形如a * b形式的表达式,将*替换为×。
"characterConversion.rules": [
[
"\\S (\\*) \\S",
"×",
1
]
],
单词缩写
例如,将function缩写为fn
呃……好吧,可能不是个好的做法,如果满屏都是fn,看着就像是另一种语言了。