VSCode中让关键词“跳出来”的稳方案是Highlight插件+自定义regexes：精准匹配注释内TODO/FIXME/HACK，支持文件过滤与半透明背景防冲突。
VSCode 默认的语法高亮对多数场景够用，但真要让代码“脱颖而出”——比如快速定位关键逻辑、区分不同环境配置、或一眼识别危险操作（如 eval、localStorage）——光靠语言内置高亮远远不够。你需要的是可定制、可叠加、能响应语义的高亮方案，而不是换个主题颜色。
怎么让特定关键词（比如 TODO、FIXME）真正“跳出来”
默认的 TODO Highlight 插件容易误匹配（比如注释里带 todo 的单词也被标红），而且不支持正则分组着色。实际用起来更稳的方式是用 Highlight 插件 + 自定义 highlight.regexes 配置：
- 安装插件
Highlight（by fengzhang85） - 在
settings.json中添加精准匹配规则："highlight.regexes": { "(//|/\*|\*)\s*(TODO|FIXME|HACK)": [ { "filterFileRegex": "\.(ts|js|jsx|tsx|py|java)$", "decorations": [ { "overviewRulerColor": "#ff4444", "backgroundColor": "#ffebee" } ] } ] } - 注意：正则开头的
(//|/\*|\*)确保只匹配注释内内容，避免误标变量名todoList - 如果项目用 Prettier，记得把
highlight.decorations的backgroundColor设为半透明（如#ffebee80），否则会和 Prettier 的行尾空格高亮冲突
为什么 Bracket Pair Colorizer 换成 Auto Rename Tag + indent-rainbow 更实用
Bracket Pair Colorizer 已被 VSCode 官方的 editor.bracketPairColorization.enabled 取代，但原生功能只管括号配对，不管嵌套深度。真正提升可读性的是组合策略：
- 开启原生括号着色：
"editor.bracketPairColorization.enabled": true - 装
indent-rainbow：用不同颜色区分缩进层级，比括号颜色更能暴露结构问题（比如if块缩进错位） - 禁用
Auto Rename Tag的自动重命名（易出错），只启用它的高亮联动：改一个 HTML 标签名，对应闭合标签实时反白，比括号配对更贴近编辑意图 - 别开
Highlight Matching Tag——它和Auto Rename Tag的高亮会打架，导致标签闪烁
如何给不同环境的配置文件加专属高亮（比如 .env.development vs .env.production）
VSCode 不会根据文件名后缀自动切换语言模式，.env.development 默认是纯文本，高亮全无。解决方案不是装一堆 dotenv 插件，而是用文件关联 + 自定义 token：
- 在
settings.json中强制绑定："files.associations": { ".env.development": "dotenv", ".env.production": "dotenv" } - 再装插件
DotENV（by mikestead），它会把API_URL=这类键名标为support.type，值标为string，比纯文本强得多 - 如果想进一步区分环境，用
Highlight插件给文件头加标记："highlight.regexes": { "^#.*development": { "decorations": [{ "color": "#2196F3" }] }, "^#.*production": { "decorations": [{ "color": "#f44336" }] } } - 注意：正则用
^#而非^#.*，避免匹配到值里带井号的内容（如PASSWORD=#123）
真正让代码“脱颖而出”的从来不是花哨的颜色，而是高亮是否精准响应你的工作流——比如在 review PR 时一眼看到所有 console.log，或调试时立刻识别出被 mock 的函数调用。这些都需要手动调参、试错、删掉无效规则，而不是装完插件就完事。
