VSCode括号匹配高亮不生效,首要确认Settings中“Highlight matching brackets”已勾选;若使用Rainbow Brackets插件则原生设置失效;还需检查文件类型识别是否正确(如.vue应为Vue.js而非Plain Text),并避免Matched brace背景色与Selection background色差过小。

括号匹配高亮不生效?先确认基础开关开了
默认是开启的,但很多人改过设置或装了插件后把它关了。光标停在 {、[、( 上没反应,第一反应不是“坏了”,而是“被关了”。
- 路径:
Settings/Preferences → Editor → General → Highlight matching brackets,必须勾选 - 这个选项控制的是“是否触发高亮行为”,和颜色无关;没勾它,后面所有配色设置都白搭
- 别和
Highlight usages of element at caret混——后者只管变量/函数引用,不管括号
Matched brace 颜色看不见?不是没高亮,是看不清
常见现象:明明勾了 Matched brace,也设了背景色,但光标一放上去,几乎看不出变化。大概率是颜色撞车了。
- 路径:
Settings/Preferences → Editor → Color Scheme → General → Matched brace - 务必勾选
Background(推荐),而不是只勾Effect;Effect在深色主题下经常透明到消失 - 检查你设的背景色(比如
#E0E0E0)是否和Selection background太接近——两者差值低于 20 个灰度级,人眼就难分辨 -
Unmatched brace是另一回事,只用于标错配对,不影响正常匹配显示
用了 Rainbow Brackets Lite 插件?原生设置自动失效
这个插件很流行,但它会接管所有括号渲染逻辑,原生的 Matched brace 设置彻底不生效。
- 安装后无需配置,重启即生效;但一旦启用,
Color Scheme → General → Matched brace的颜色设置就完全被忽略 - 如需 JSX/TSX 中的
<div> 标签也被染色,进 <code>Settings → Editor → Rainbow Brackets勾选Enable for XML/HTML tags - 注意:一行嵌套超过 5 层时,最外层括号可能变灰——这是插件主动降噪,不是 bug
- 右键文件 →
Associate with File Type…,确认是Vue.js、Svelte、Blade Template等对应类型,不是Text - .blade.php 需额外支持:仅启用 PHP 插件不够,得装
Laravel Idea或官方Blade Support,否则@if块无法被解析为可跳转结构 - 状态栏右下角应显示对应语言名(如
Vue.js),不是Plain Text;点它可手动切换
.vue/.svelte/.blade.php 文件里括号不匹配?文件类型没认对
这类混合语法文件中,{ 可能是模板插值、JS 对象字面量,也可能是 Pug 属性表达式。WebStorm 若识别成 Text 或 HTML,括号就当普通字符处理,匹配逻辑直接跳过。
立即学习“PHP免费学习笔记(深入)”;
真正卡住人的地方,往往不在“怎么开”,而在“谁在关”——Rainbow Brackets 插件、错误的文件类型关联、和 Selection background 几乎同色的 Matched brace 背景,这三者叠加,能让高亮功能形同虚设,却查不出明确报错。


















