代码高亮需插件增强实用性：Better Comments区分注释语义，Bracket Pair Colorizer 2实现括号配对高亮，Color Highlight实时预览颜色值，Error Lens行内显示错误；四者覆盖90%视觉优化需求，避免冗余安装引发冲突。
代码高亮本身是 VS Code 自带能力，但“让高亮真正有用”——比如区分注释类型、匹配括号、突出 TODO、显示颜色值、标记错误位置——这些全靠插件补足。没装对插件，你看到的只是语法着色，不是可读性提升。
注释高亮：别让 // TODO 沉在代码里
默认的灰色注释根本抓不住眼球，尤其在长函数中容易被忽略。必须用插件把不同语义的注释变成视觉信号：
-
Better Comments或Colorful Comments：支持用!（红色）、?（蓝色）、TODO（深黄）等符号触发对应颜色，配置项少、开箱即用 - 避免装多个同类插件：
Better Comments和TODO Highlights功能重叠，选一个即可；后者更专注TODO/FIXME，不支持自定义符号 - 注意配置顺序：如果同时用了
Prettier，确保它不格式化掉注释前的空格——否则//!可能被缩成// !，导致高亮失效
括号/标签配对高亮：一眼找到另一半
写 JSX、Vue 或嵌套 JSON 时，光靠颜色不够，得有结构指引：
-
Bracket Pair Colorizer 2：给每层括号（{}、[]、()）分配不同颜色，选中一个自动高亮同级和匹配项；VS Code 1.79+ 原生已内置类似功能，但该插件仍更稳定、支持更多符号（如<>） -
Highlight Matching Tag：专治 HTML/Vue 模板，点击<div>，自动下划线标出闭合的</div>；不兼容 Svelte 的<script>块，别在 .svelte 文件里强求 - 别装
Auto Rename Tag来替代这个——它只改名，不提供视觉匹配
颜色值实时预览：CSS/SCSS 中的 #3b82f6 就该直接看见蓝色
靠脑补十六进制色值效率极低，且易错：
-
Color Highlight：轻量、无配置，支持rgb()、hsl()、变量（如$primary，需配合SCSS IntelliSense） - 如果项目用 Tailwind：
Tailwind CSS IntelliSense自带颜色预览，且能 hover 看到对应 class 效果，比Color Highlight更精准 - 注意冲突：某些主题（如
Material Theme）会覆盖插件的颜色框样式，若预览框变模糊，先关主题或换Dark+ (default dark)测试
错误与警告行内显示：别 hover，直接看
ESLint 或 TypeScript 报错默认要悬停才显示，打断编码流：
-
Error Lens：把错误信息直接印在出错行末尾，红色高亮 + 图标，支持Ctrl+Click跳转到问题源头 - 它依赖语言服务器输出，所以必须先装好对应语言插件（如
ESLint、Pylance），否则只显示“no diagnostics” - 性能敏感项目慎用：大型 monorepo 中开启
Error Lens可能拖慢保存响应，可设"errorLens.showOnSaveOnly": true缓解
高亮插件不是越多越好——Better Comments + Bracket Pair Colorizer 2 + Color Highlight + Error Lens 这四组覆盖了 90% 的视觉干扰场景。多装一个，就多一分配置冲突和启动延迟，尤其是 Bracket Pair Colorizer 2 和原生括号高亮共存时，偶尔会颜色错位，这时候得手动禁用原生功能："editor.bracketPairColorization.enabled": false。
