通过自定义ESlint插件约束写代码必须写注释

103 阅读1分钟

最近有同学 维护 一个多人维护的仓库,反馈很多代码看不懂,没有注释,我想了下,后续我们得提供一个方案,检测每次提交的代码,有没有写注释,定义一个代码 和注释的百分比,小于这个百分比,不然提交。 这样强制约束每个人写代码都有注释

目前的想法: 自定义一个 eslint-plugin , 代码 commit 阶段,扫描提交的代码行数,检测 代码 和注释的 百分比

  1. 团队维护的仓库越来越多,团队也越来越大,为了保持代码的可维护性,要求每个函数,每个组件都需要有注释,方便后续维护

  2. 但是通过 code review 来约束添加注释,以实现有效的控制。所以想通过自定义 eslint 来约束团队成员在编写业务代码的过程中也会添加注释

  3. 如何使用:

    1. 默认 每 20行 代码 需要加一行注释, 可以通过 eslint plugin 配置 N 行有一行注释
    2. 下面这种使用方式,可以自定义每多少行代码需要加一行注释。用户接入 eslint 插件自定义 有效代码注释比
    3.  // npm install eslint-plugin-comment-prompt --save-dev
      
       import commentPrompt from "eslint-plugin-comment-prompt";
       export default [
           {
               plugins: {
                    'comment-prompt': commentPrompt
               },
               rules: {
                   // 默认 每 20行 代码 需要加一行注释 --> 这里配置的 每30行代码必须要有1行注释 
                   // 有效代码注释比 30
                   "comment-prompt/rule-name": ["error", 30]
               }
           }
       ];
      
  4. 效果如下:

image.png

  1. Github 链接为: github.com/webgzh90724…