VSCode高亮异常的核心原因是语言模式未正确绑定或TextMate规则不匹配；需先确认右下角语言标识是否正确，再检查files.associations配置与插件启用状态，并用Developer: Inspect Editor Tokens验证实际作用域。
VSCode 默认就支持主流语言的语法高亮，但“开箱即用”不等于“开箱即精准”——很多语言（比如 QML、Q#、自定义 DSL）或特定文件后缀（如 .vue 中的模板块、.astro 的脚本部分）会高亮错乱、关键字不着色、字符串漏匹配。问题不在 VSCode 本身，而在语言识别和词法规则是否对齐。
为什么某些文件没高亮或高亮错乱？
核心原因通常是语言模式未正确绑定或 TextMate 规则覆盖不全：
- 右下角状态栏显示的语言名不是你预期的（比如打开
.qml显示为Plain Text），说明 VSCode 没识别出该文件类型 -
files.associations配置缺失或写错，例如把"*.qss"错配成"qss"（缺通配符） - 插件未启用词法高亮能力，仅提供 LSP 支持（如某些旧版 QML 插件只做诊断，不管高亮）
- 多个插件冲突，比如同时装了
Vetur和Volar，后者默认禁用 Vetur 的高亮逻辑
如何手动绑定文件后缀到指定语言？
这是最常被忽略却最有效的第一步，尤其对非标准扩展名或混合格式文件：
- 打开
settings.json（快捷键Ctrl+,→ 右上角齿轮图标 → “Edit in settings.json”） - 添加或修改
files.associations字段，例如：{ "files.associations": { "*.qml": "qml", "*.qs": "qsharp", "*.mydsl": "source.mylang" } } - 注意：语言 ID 必须是 VSCode 内部注册的合法 ID（查法：打开对应文件 → 点右下角语言名 → “Configure Language Specific Settings…” → 看顶部提示）
- 改完保存，重新打开文件或执行
Developer: Reload Window
如何调试当前光标位置的高亮作用域？
当你想确认某段代码为何没按预期着色，或者要写自定义颜色规则时，必须知道它属于哪个 scope：
- 按
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS），输入并运行Developer: Inspect Editor Tokens - 将光标放在目标代码上（比如一个
function关键字），面板会显示完整作用域链，如keyword.control.js或support.type.object.console - 这个 scope 名称就是你在
editor.tokenColorCustomizations.textMateRules中要匹配的值 - 别直接抄网上示例的 scope —— 不同插件、不同主题返回的 scope 可能完全不同
自定义高亮颜色时最容易踩的坑
很多人照搬配置后发现没生效，根本原因是作用域匹配失败或层级被覆盖：
-
editor.tokenColorCustomizations只对当前主题生效，换主题后需重配；若想全局生效，得用workbench.colorCustomizations配 color ID（更复杂） - scope 匹配是前缀最长优先，
keyword会被keyword.control.js覆盖，所以写规则时尽量具体 - 不要在
textMateRules里写错 JSON 结构，比如漏掉settings对象或拼错foreground - 某些插件（如
Prettier）可能在保存时格式化掉你的settings.json缩进，导致语法错误而整个配置失效
真正卡住人的往往不是“怎么加高亮”，而是“为什么加了没反应”——重点盯住右下角语言标识、files.associations 的拼写、以及 Inspect Editor Tokens 返回的实际 scope。这三个点串起来，90% 的高亮异常都能定位到根因。
