最安全有效的做法是直接修改 settings.json 中的 editor.tokencolorcustomizations;需用“inspect editor tokens and scopes”精准获取 scope,workbench.colorcustomizations 不影响代码高亮,语义高亮优先于词法高亮但依赖语言服务器和主题支持。

VSCode 插件实现语法高亮个性化,核心不在写插件,而在于搞清“谁在控制高亮”——editor.tokenColorCustomizations 是唯一安全、直接、无需重启就能生效的配置入口;所有试图改 workbench.colorCustomizations 或主题文件的做法,对代码文本本身都无效。
为什么改了 settings.json 没反应?检查这三处
常见失效不是配置错,而是结构或路径不对:
-
editor.tokenColorCustomizations必须是顶层字段,不能嵌套在其他对象里(比如别塞进"workbench.colorCustomizations"里) -
textMateRules必须是数组,每条规则是对象,且必须含"scope"和"settings"字段 - 颜色值只接受十六进制(如
"#ff6b6b")或带 alpha 的rgba()(如"rgba(255, 107, 107, 0.4)"),rgb()和命名色("red")会被静默忽略
怎么精准定位 keyword / string / function 名的作用域?
靠猜 scope 名字基本白忙——不同语言扩展、不同主题、甚至同一语言的不同上下文,scope 都可能不同。必须用 VSCode 自带工具实时抓取:
- 把光标停在目标词上(比如一个
return、一个双引号字符串、一个类名) - 按
Ctrl+Shift+P(Windows/Linux)或Cmd+Shift+P(macOS) - 输入并执行
Developer: Inspect Editor Tokens and Scopes - 看面板顶部第一个带语言后缀的 scope(如
keyword.control.js、string.quoted.double.python),优先用它
右侧 foreground 列显示当前实际颜色,改完立刻能比对是否生效。
想只对 Python 或 TypeScript 单独调色?用 language-specific rules
全局改容易冲突,按语言隔离更可控。VSCode 支持在 editor.tokenColorCustomizations 下为特定语言单独定义规则:
- 结构上,把
textMateRules移到语言键下,例如:"[python]": { "editor.tokenColorCustomizations": { "textMateRules": [...] } } - 注意:这种写法必须放在
settings.json顶层,不能包在其他字段里 - 语言 ID 要准确,可通过右下角语言模式查看(如
Python对应[python],TypeScript React对应[typescriptreact]) - 不支持通配符,
[javascript]不会覆盖[typescript],得分别写
插件开发时语法高亮不生效?先确认 grammar 文件加载路径
如果你在写自定义语言插件(比如支持 .mylang),语法高亮失效往往卡在路径配置上:
-
package.json中grammars的path是相对于插件根目录的相对路径,不能以/开头 - 文件必须是
.json格式(TextMate 语法),且内容符合 schema:必须有scopeName,patterns数组不能为空 - 正则中转义要双写,比如匹配双引号字符串应写
"\".*?\"",而不是"\".*?\""(JSON 字符串内需转义反斜杠) - 改完 grammar 文件后,必须重载插件(
Ctrl+Shift+P→Developer: Reload Window),仅保存不触发重新加载
真正容易被忽略的是 scopeName 与 language ID 的对应关系:如果 package.json 里 languages.id 是 myLanguage,那 grammar 的 scopeName 就得是 source.mylang(VSCode 会自动映射 myLanguage → source.mylang),不一致就完全不加载。











