VSCode默认支持基础语法高亮，无需插件；若失效，先检查右下角语言模式是否正确、配色主题是否启用（如Dark+），再确认文件关联或安装针对性插件（如highlight-words用于词级高亮）。
VSCode 默认就支持基础语法高亮，不需要装插件也能用；但“必备插件”这个说法容易误导——真正该装的，是解决你当前具体问题的那一个，不是清单式堆砌。
为什么有些代码没高亮？先查语言模式和主题
最常见的情况不是插件没装，而是 VSCode 没认出你在写什么语言。右下角状态栏显示的是 Plain Text 或错误的语言 ID（比如本该是 typescript 却显示 javascript），高亮就会失效。
- 点击右下角语言名称，手动选对模式，如
React、Vue、SCSS - 检查配色主题是否启用：按
Ctrl+Shift+P（Windows/Linux）或Cmd+Shift+P（macOS），输入Preferences: Color Theme，选一个非High Contrast的主题（比如Dark+ (default dark)） - 如果文件后缀不标准（如
.jsx被当成javascript），在settings.json中加"files.associations"显式绑定：{"*.jsx": "react"}
highlight-words：临时高亮某个变量或关键词
这不是语法高亮，而是「词级高亮」——类似 Source Insight 的 F8 功能。适合调试时盯住一个变量名、函数调用或错误码。
- 安装插件
highlight-words（作者：vincaslt） - 关键配置项
highlightwords.defaultMode必须设为1（全词匹配），否则搜id会把identifier也标红 - 快捷键默认未绑定，需在
keybindings.json里加：[{"key": "f8","command": "highlight-words.highlightAtCursor","when": "editorTextFocus"}] - 颜色数组
highlightwords.colors建议删减到 3–4 个，太多反而难分辨；避免用纯白/纯黑，推荐"#ff6b6b"、"#4ecdc4"这类带灰度的色值
Color Highlight：CSS/SCSS 里的颜色值实时渲染色块
它不改语法高亮，只给颜色字面量加小色块。如果你在写样式却看不到 #3498db 旁边的小方块，说明它根本没生效。
- 确认当前文件语言模式是
css、scss、html或vue；plaintext和json默认不支持 - 若用 Vue 单文件组件，需在
settings.json中显式加入："colorHighlight.languages": ["vue", "html", "css", "scss"]
- 注释里的颜色（如
// #ff6b6b）默认不渲染，要开启colorHighlight.showColorsInComment - 如果色块发虚或偏移，关掉所有插件，用
code --disable-extensions启动测试——大概率是其他插件（如 Prettier、Bracket Pair Colorizer）干扰了装饰器渲染
editor.tokenColorCustomizations：精准覆盖某类语法元素颜色
这是最硬核但也最容易翻车的方式。别盲目复制网上示例，scope 错一个字母就无效。
- 先打开开发者工具：
Help → Toggle Developer Tools，再按Ctrl+Shift+P输入Developer: Inspect Editor Tokens，把光标停在想改的词上（比如一个function关键字），看右下角显示的 scope 列表 - 常见 scope：
keyword、support.type.object.console、entity.name.function；不同语言、不同插件返回的 scope 差异极大 - background 字段在部分语言（如 TypeScript）中会被忽略，只支持
foreground和fontStyle；想给函数体加背景色，得靠插件（如indent-rainbow）模拟 - 修改
editor.tokenColorCustomizations后必须重启编辑器窗口（不是 reload window），否则部分规则不加载
真正容易被忽略的，是语言服务器和语法高亮的分工：前者管语义（比如变量类型、引用跳转），后者只管词法（比如关键字、字符串怎么染色）。装一堆“增强高亮”插件却没开对应语言服务器，往往只是换了个更花哨的 syntax highlight，实际诊断能力没变。
