Bracket Bold
光标位于 ()、[]、{} 附近时,自动找到与之配对的那个括号,并把这一对括号加粗 / 高亮,方便看清代码结构。
特性
- 自动定位光标旁的
()、[]、{},将配对的两个括号同时高亮
- 跳过字符串、注释里的括号:
"a(b)"、// (x)、/* (y) */ 中的括号不会参与配对
- 支持模板字符串插值:
`a${fn([1])}b` 中 ${...} 内的括号会正常配对
- 语言感知注释:
// 与 /* */:多数 C 系语言(JS/TS/C/C++/Java/C# 等,默认)
#:Python / Shell / PowerShell / Ruby
--:SQL / Lua
- Python 三引号
''' / """ 文本会被正确跳过
- 错误嵌套检测:
([)] 这种交叉错配的括号不予高亮,避免误导
- 支持多光标(每个光标独立匹配)
安装
安装 Node.js 与 VS Code
在本目录运行:
npm install
npm run compile
npx @vscode/vsce package # 生成 bracket-bold-0.0.1.vsix
code --install-extension .\bracket-bold-0.0.1.vsix --force
在 VS Code 中 Ctrl+Shift+P → Reload Window 生效
开发调试可直接用 VS Code 打开本文件夹按 F5(Extension Development Host)。
配置
设置面板搜索 bracketBold,或写入 settings.json:
| 配置项 |
默认值 |
说明 |
bracketBold.fontWeight |
"900" |
加粗字重(如 700 / bold / 900) |
bracketBold.color |
"" |
括号颜色(空 = 跟随主题) |
bracketBold.background |
"rgba(255,190,0,0.28)" |
高亮底色 |
bracketBold.border |
"1px solid rgba(255,190,0,0.6)" |
高亮边框 |
例如改成醒目金色:
{
"bracketBold.fontWeight": "bold",
"bracketBold.color": "#FFD700",
"bracketBold.background": "#333333",
"bracketBold.border": "1px solid #FFD700"
}
把某几项设成空字符串即可关闭该效果。
目录结构
bracket-bold/
├─ src/ # TypeScript 源码
│ ├─ extension.ts # 扩展入口:装饰器、事件监听、配对查找
│ └─ brackets.ts # 纯逻辑:词法扫描 + 括号配对(无 vscode 依赖,可单测)
├─ out/ # tsc 编译产物(.js + .map),扩展实际加载的是这里
├─ tools/ # 本地开发脚本:单元测试 / 性能基准
├─ package.json # 扩展清单:名称、配置项、依赖
└─ tsconfig.json # TypeScript 编译配置
开发指南
npm run compile # tsc 编译 src → out
node tools/scan.test.js # 跑词法 + 配对算法的单元测试(31 项)
node tools/bench.js # 50000 行大文件性能基准
已知限制
- JS 正则
/.../、JSX 标签文本中的括号会被当作普通括号统计(需语言解析器才能完全避免)
- 模板字符串内的嵌套插值达到较深层级时状态较简单化处理
许可证
MIT(发布到市场前请补充 LICENSE、repository、截图等元数据)。
| |