是什么

Better Comments(aaron-bond.better-comments)根据注释开头的标签给整条注释上色,不需要命令或快捷键。

用法

在注释符号后面紧跟标签即可(中间可以有空格)。标签不区分大小写,TODO 和 todo 都行。

// ! 警告:这里修改会影响线上数据
// fixme 已知 bug,待修复
// todo 之后补上错误处理
// hack 临时绕过的写法
// ? 这个参数为什么要乘 2?
// note 说明
// * 重点:这个函数会被频繁调用
//// const old = legacyCall();

效果:

vNAcxDLogjsDGE0xSMbOhJ2Uu1v2xI6V.png

写法用途样式
// !警告、危险操作红色,粗体,红底
// fixme已知 bug粉红,粗体,底色稍深
// todo待办橙色,橙底
// hack临时绕过紫色,紫底
// ?疑问蓝色,蓝底
// note说明青色,青底
// *重点绿色,绿底
////废弃代码灰色,删除线,无底色

块注释里每行开头也可以放标签:

/**
 * ! 不要在循环里调用
 * todo 改成异步
 */

注意事项

  • 标签必须在注释开头,// 说明 ! 不会触发。
  • 只按开头匹配:// notes ... 也会被当成 note。不想这样可以把标签改成 note:。
  • 废弃代码标签本身是 //,所以 JS 里要写 ////,Python 里写 # //。
  • 块注释每行开头的 * 会被识别成 * 标签,JSDoc 可能整片变绿。
  • 纯文本文件默认不生效,需要 "better-comments.highlightPlainText": true。
  • 改完标签后要 Ctrl+Shift+P → Reload Window 才生效。
  • 和 TODO Highlight 插件同时装时,TODO 会被重复高亮,留一个就好。

配色

颜色取自 Catppuccin Mocha 调色板,背景用同色加透明度做成色块,和代码的语法高亮区分开。颜色值最后两位是透明度:26 约 15%,33 约 20%,40 约 25%,1A 约 10%。

文字颜色在 Mocha 背景 #1e1e2e 上的对比度(WCAG 正文标准是 4.5:1):

颜色对比度
#F38BA8 red7.08
#89B4FA blue7.79
#7F849C overlay14.44
#FAB387 peach9.27
#A6E3A1 green11.03

完整配置

放在 ~/.config/Code/User/settings.json:

"better-comments.tags": [
  { "tag": "!",     "color": "#F38BA8", "strikethrough": false, "underline": false, "backgroundColor": "#F38BA826", "bold": true,  "italic": false },
  { "tag": "?",     "color": "#89B4FA", "strikethrough": false, "underline": false, "backgroundColor": "#89B4FA26", "bold": false, "italic": false },
  { "tag": "//",    "color": "#7F849C", "strikethrough": true,  "underline": false, "backgroundColor": "transparent", "bold": false, "italic": false },
  { "tag": "todo",  "color": "#FAB387", "strikethrough": false, "underline": false, "backgroundColor": "#FAB38726", "bold": false, "italic": false },
  { "tag": "fixme", "color": "#EBA0AC", "strikethrough": false, "underline": false, "backgroundColor": "#EBA0AC33", "bold": true,  "italic": false },
  { "tag": "hack",  "color": "#CBA6F7", "strikethrough": false, "underline": false, "backgroundColor": "#CBA6F726", "bold": false, "italic": false },
  { "tag": "note",  "color": "#94E2D5", "strikethrough": false, "underline": false, "backgroundColor": "#94E2D526", "bold": false, "italic": false },
  { "tag": "*",     "color": "#A6E3A1", "strikethrough": false, "underline": false, "backgroundColor": "#A6E3A126", "bold": false, "italic": false }
],