VSCode代码高亮问题根源在于配置错位而非插件缺失：Vue文件需设语言模式为Vue并禁用冲突插件，React/TS高亮依赖语言服务器就绪与正确tsdk路径，颜色色块需开启decorations且关联语言，选中高亮需分别配置四项独立设置。
VSCode 默认就有代码高亮，新手不用装一堆插件就能用；真正要配的，是让高亮“不翻车”——比如 Vue 文件变白板、React 关键字不着色、颜色值没色块、选中后文字看不清。
Vue 文件语法高亮失效（.vue 变成纯白/HTML 风格）
根本不是高亮“没开”，而是 VSCode 根本没认出这是 Vue 文件。它默认当 plaintext 或 html 处理，Volar 就不会加载语法树。
- 右下角状态栏点语言模式，手动选
Vue（不是Vue HTML，也不是HTML） - 确认已安装
Volar（Vue 3）或Vetur（Vue 2），且另一方已完全禁用——二者共存必冲突 - 在
settings.json中加这条，强制关联："files.associations": {"*.vue": "vue"} - 删掉旧的
beautify插件和本地.jsbeautifyrc，它会把<script setup>挤成一行，破坏语法结构
React / TypeScript 关键字颜色淡、括号不匹配
这不是插件没装，而是主题或语言服务没加载稳。Volar、TypeScript Nightly 这类语言服务器启动有延迟，尤其打开大项目时，前几秒高亮就是残缺的。
- 别急着重装插件，等 3–5 秒再看——右下角出现
TS Server ready或Volar initializing...消失后再判断 - 换回 VSCode 自带主题
Dark+ (default dark)或Light+测试：第三方主题（如 One Dark Pro）常硬编码 token 颜色，覆盖你设置的高亮规则 - 检查
typescript.tsdk是否指向项目本地node_modules/typescript，否则 TS 语言服务可能降级为内置旧版，导致const、as等新关键字不识别
颜色值（#3498db、rgb(255,0,0)）不显示色块
Color Highlight 插件本身轻量可靠，但它的触发依赖两个前提：文件语言模式正确 + 编辑器允许渲染装饰（Decorations）。
- 打开含颜色的
.css或.vue文件后，右下角确认语言是CSS或Vue；若显示Plain Text，点击切换 - 在设置里搜
editor.decorations，确保值为true（某些极简主题会关掉这个） - 如果
.vue里<style>块仍不生效，在settings.json中显式补上："colorHighlight.languages": ["vue", "css", "scss"] - 避免用
colorHighlight.showColorsInComment: true去高亮注释里的颜色——部分正则会误匹配 JS 字符串，导致语法解析失败
选中文字后代码变糊、同名变量高亮看不见
VSCode 把“鼠标拖选”“双击变量高亮”“搜索匹配”“终端选中”四件事拆成四个独立配置项，改错一个就只剩一半效果。
-
editor.selectionBackground控制你亲手划的那块：建议用"#264f7866"（带透明度的蓝），别用纯黑/纯白 -
editor.selectionHighlightBackground控制双击变量后的淡色标记：必须是十六进制，如"#5a5a5a"，不支持rgb() -
workbench.colorCustomizations.editor.findMatchBackground是 Ctrl+F 的颜色，得套在workbench.colorCustomizations对象里才生效 - Remote-SSH 场景下，这些设置必须写在远程窗口的
settings.json，本地改了没用
最常被忽略的一点：高亮异常往往不是“少装插件”，而是“多装了一个不该装的”——比如 Vetur 和 Volar 并存、Prettier 和 Volar 格式器抢格式化权、主题强行覆盖 token 颜色。先关插件、换默认主题、看右下角语言模式，比反复重装快得多。
