WebStorm IDE版本： Build #WS-192.6817.13 或者 2019.09.24构建版本
代码里经常用到的注释方式有以下几种：
- 单行注释：
// ...... - 块注释：
/* ...... */ - 文档注释：
/** ...... */
在不同的IDE中，这些注释的样式有所差异，有的样式比较醒目，能引起人的注意；有的则比较暗淡，尽量不分散写代码的注意力。如果有需要的话，绝大部分IDE都能够对各种注释方式的样式进行自定义（如修改字体、颜色、大小等）。请看下面的例子：
图1 LayaAir 2.x IDE的注释颜色
图2 WebStorm IDE的注释颜色（自定义后的颜色）
WebStorm特殊注释标记TODO、FIXME
WebStorm中还有一些能帮助我们提高工作效率的注释标记，例如TODO（大部分IDE都有类似的特殊标记）和FIXME。先看看例子：
图3 WebStorm中TODO、FIX注释标记
可以看到在双斜杠之后添加
TODO、FIXME关键字都可以使注释的样式发生变化，这样的特殊注释可以跟一般的注释区别开来，便于我们快速识别。当TODO、FIXME注释行下方的连续注释行存在缩进时（tab或空格），属于同一块标记注释块。（不仅双斜杠注释可以使用TODO、FIXME，其他类型的注释快也可以使用）
WebStorm中的TODO面板
如果仅仅是以特殊的标记方式，还不能很好的提高我们的工作效率，WebStorm还提供了专门的面板供我们索引项目中，或单文件中所有的特殊标记，通过点击IDE下方TODO标签（Alt + 6）打开该面板，如下图：
图4 WebStorm中的TODO面板
-
TODO面板标签按钮入口 - 索引范围：
-
Project整个项目 -
CurrentFile当前文件 -
Scope Based基于指定范围（可以自定义范围，这里不详述）
-
- 索引列表，可以单击跳转到对应的注释位置
WebStorm自定义TODO、FIXME的样式
依次点击File - Setting（或Ctrl + Alt + S），打开设置面板，并在设置面板中搜索“TODO”，见下图：
图5 在设置面板中搜索TODO
- 搜索“
TODO” - 搜索“
TODO”后的结果 - 样式栏，
WebStorm通过样式栏提供的正则表达式来查询特殊标记，默认会有todo和fixme的正则：\b(todo|fixme)\b.* - 添加、删除、编辑特殊标记正则表达式
选中列表中的样式，点击编辑按钮打开编辑面板，编辑特殊标记的样式，见下图：
图6 样式编辑面板
- 修改正则表达式
- 选择图标
- 是否为正则表达式中的字符开启大小写敏感
- 样式编辑区域，勾选 ‘
Use color scheme TODO default colors’后，使用的是全局主题中的默认配色方案。如果要自定义样式，先取消勾选。
点击添加按钮打开添加面板，跟上面的编辑面板雷同，可以添加自定义的特殊标记正则表达式，如自定义正则：\b(freeman)\b:.*，并使用自定义样式，前景色选成蓝色，见下图：
图7 添加自定义样式
添加完成后看看效果：
图8 自定义特殊标记
图9 在TODO面板中的效果
WebStorm中的TODO面板中的筛选功能
再次打开设置面板，并在设置面板中搜索“TODO”，查看上图5中，Filters栏目：
图10 筛选器
点击右侧的添加按钮并添加筛选过滤，打开添加面板，新增名称为
@freeman的筛选器，并勾选对应的样式，如下图：
图11 添加筛选器
- 筛选器名称
- 筛选器对应的特殊标记
现在我们回到TODO面板，使用我们刚刚添加的筛选器：
图12 使用筛选器
这样就可以只看@freeman的特殊注释了。
WebStormw文档参考地址
