VSCode插件实现代码语法高亮美化-VSCode-PHP中文网

语法高亮依赖textmate语法规则而非主题颜色：1.由.tmlanguage.json定义匹配规则并映射作用域；2.主题仅渲染作用域对应颜色；3.需确保语言模式激活、插件启用及scope精确匹配；4.自定义颜色须通过editor.tokencolorcustomizations配置。

vscode插件实现代码语法高亮美化

语法高亮靠的是 TextMate 语法规则，不是主题颜色

VSCode 的语法高亮本质是词法分析（lexical analysis），由 tmLanguage.json 文件定义匹配规则，再映射到作用域（scope）上。主题只负责把 scope 渲染成颜色，不参与识别逻辑。装了深色主题但关键字还是灰色？大概率是语言模式没激活，或语法规则没加载。

常见错误现象：*.py 文件右下角显示 “Plain Text”；return 和 def 颜色一样；字符串里嵌套的变量名没高亮。

确认当前文件已正确绑定语言模式：点击右下角语言标签 → 选对应语言（如 python），或按 Ctrl+Shift+P 输入 Change Language Mode
检查插件是否启用：比如 Python 必须装 ms-python.python 或 ms-python.pylance，光装主题没用
自定义语法时，scopeName 必须与 package.json 中 grammars.language 一致，例如都为 source.mylang
正则匹配要加 word boundary（\b），否则 if 会误匹配 ifstream

手动改高亮颜色必须用 `editor.tokenColorCustomizations`

想把注释变灰、字符串加斜体、函数名加粗？不能去改主题文件，也不能在 workbench.colorCustomizations 里瞎试——那只会调侧边栏颜色。

真正生效的路径只有一条：settings.json 里的 editor.tokenColorCustomizations 字段。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

先用 Ctrl+Shift+P 运行 Developer: Inspect Editor Tokens and Scopes，把光标停在目标词上（比如一个 class 关键字），看顶部显示的 scope（如 keyword.control.python）

在 settings.json 中添加规则，格式严格：

{
  "editor.tokenColorCustomizations": {
    "textMateRules": [
      {
        "scope": "keyword.control.python",
        "settings": {
          "foreground": "#c792ea",
          "fontStyle": "bold"
        }
      }
    ]
  }
}

scope 名称区分大小写，且不同语言扩展可能提供不同 scope（Pylance 和旧 Python 扩展输出的 scope 不同）
改完不用重启，保存即生效；如果没反应，检查 JSON 是否有语法错误，或 scope 是否拼错

Vue/React/WXML 等模板类文件高亮失效，90% 是语言模式没对上

打开 .vue 文件，右下角显示 HTML 或 Plain Text？那后续所有高亮、补全、格式化全废。这不是插件没装，是 VSCode 根本没把它当目标语言处理。

必须手动关联："files.associations": {"*.vue": "vue"}（Vue 3）或 {"*.wxml": "wxml"}（微信小程序）
Volar 和 Vetur 不能共存，Vue 3 项目务必卸载 octref.vetur 再装 Vue.volar
.wxml 文件还依赖项目根目录存在 project.config.json，否则 minapp-vscode 插件降级为仅基础高亮
别在 beautify.language.html 里加 "vue" —— 这个配置已过时，且和 Volar 冲突

插件开发中语法高亮不生效，先查 `package.json` 的三个字段

自己写的插件在调试时语法高亮不出现，问题几乎都卡在这三处配置上，而不是 tmLanguage.json 写得不够复杂。

contributes.languages.id 必须和 contributes.grammars.language 完全一致（比如都是 mylang）
contributes.languages.extensions 要带点号：[".mylang"]，写成 ["mylang"] 就不匹配
contributes.grammars.path 是相对于插件根目录的路径，必须真实存在且可读；VSCode 不报错，只静默忽略
scopeName 在 tmLanguage.json 中必须唯一，且不能含空格或非法字符（如 source.my lang 会失败）