如何配置RainbowBrackets插件实现VSCode括号高亮显示？

本文共计935个文字，预计阅读时间需要4分钟。

别装R，直接输出结果：

为什么 Rainbow Brackets 插件现在不能用

CoenraadS 版本的 Rainbow Brackets 自 2021 年起就不再维护；VSCode 官方从 1.60 版本开始内置 editor.bracketPairColorization.enabled，性能更好、支持 JSX/HTML/Python 等全语言括号（包括 HTML 标签对），而插件无法启用该底层能力。常见错误现象：Rainbow Brackets 启用后括号仍无颜色，本质是原生配对识别被禁用，插件“上色”失败。

• 装了插件但没效果 → 实际是 editor.bracketPairColorization.enabled 被设为 false
• 括号闪烁、光标跳动、JSX 大括号错色 → 插件与原生功能同时运行引发冲突
• 打开大文件明显卡顿 → 插件使用旧式文本扫描，CPU 占用高，原生功能基于 AST 更稳定

正确开启 VSCode 原生括号彩色嵌套

这是所有高亮的基础，必须先做：

• 按 Ctrl + ,（Windows/Linux）或 Cmd + ,（macOS）打开设置
• 搜索 bracket pair colorization，勾选 Editor: Bracket Pair Colorization（对应配置项："editor.bracketPairColorization.enabled": true）
• 顺手搜索 match brackets，把 Editor: Match Brackets 设为 always，否则光标靠近括号时可能不触发高亮
• 若仍无效，检查右下角 language mode 是否为 JavaScript、Python 等，而非 Plain Text（.env 或未关联后缀易出此问题）

自定义三层彩虹色：只改 foreground1–3 就够了

VSCode 原生最多支持 6 层嵌套着色，但只暴露 foreground1–foreground3 给用户配置；第 4 层起自动循环复用前 3 种颜色。改太多反而破坏层级语义，也容易和主题背景打架。

在 settings.json 的 workbench.colorCustomizations 中添加：

"workbench.colorCustomizations": { "editorBracketHighlight.foreground1": "#FF9966", "editorBracketHighlight.foreground2": "#66CCFF", "editorBracketHighlight.foreground3": "#FF66CC", "editorBracketHighlight.unexpectedBracket.foreground": "#FF3333" }

• foreground1：最外层（如函数体的 {}）
• foreground2：中间层（如 map() 内的 []）
• foreground3：最内层（如箭头函数的 ()）
• unexpectedBracket.foreground：不匹配括号（多写一个 } 立刻标红，这个很多人漏配）

HTML/JSX 标签括号也想彩色？必须开 guides

VSCode ≥ 1.70 才真正支持 HTML 开闭标签、JSX 大括号着色，但仅开 bracketPairColorization 不够，还需启用括号引导线：

• 在 settings.json 中加："editor.guides.bracketPairs": "all"（显示全部）或 "active"（只当前）
• 部分轻量主题（如 Light+）未声明 editorBracketMatch.background1 等 token，会导致着色不可见；最快验证方式：左下角切换到 GitHub Dark 或 One Dark Pro，看是否立刻出彩
• 若坚持用当前主题又想要颜色，直接在 workbench.colorCustomizations 里补 editorBracketMatch.background1–background3，值同 foreground 逻辑即可

最容易被忽略的是：语言模式识别失败（比如 .vue 文件 script 区域括号不着色），往往不是配置问题，而是 Volar 插件没装或没启用；还有就是 workspace settings 覆盖了全局设置，得去文件夹下的 .vscode/settings.json 里单独检查。