JS - DangerJs运用

前言

在开源社区中，DangerJs可以拿来自动判断每个人提交的代码合并请求（github中叫Pull Request，简称PR，gitlab中叫Merge Request，下文简称MR）是否符合规范，自动化一些费时费力的人工检查，从而保证代码质量，是项目管理的利器。

一. 前期准备

1.1 创建私有 Token

拥有自己的github账号，最好是一个共用的机器人账号。以github为例，我们创建自己的私有Token。地址。备注：如果是gitlab，就去gitlab上创建。

如图：

创建好后，记得备份生成的秘钥：只会生成一次。后续看不到了。

1.2 Git 设置对应的 Token 以及 Host 环境变量

以Gitlab为例（内网）：

1. 记得将机器人账号加入到项目A中。
2. 进入项目A中，点击左侧的Settings --> CI/CD。
   
3. 选择Variables，添加环境变量。点击添加两个K-V：
   

如下：

• DANGER_GITLAB_API_TOKEN：第一步生成的token值。
  
• DANGER_GITLAB_HOST：Token的一个私有服务器，填你内网的Git域名即可。
  

1.3 项目安装 dangerJs

npm i danger --save-dev

在项目根目录下创建文件：dangerfile.ts

import { message, danger, fail } from 'danger';
const {
  git: { created_files: createdFiles, modified_files: modifiedFiles, deleted_files: deletedFiles },
} = danger;

const fileChanges = [ ...modifiedFiles, ...createdFiles, ...deletedFiles ];
message(`This MR contains ${fileChanges.length} files (${createdFiles.length} created, ${modifiedFiles.length} modified, ${deletedFiles.length} deleted)`);

然后我们可以在package.json中添加一个脚本命令：

{
	"scripts": {
		"danger": "npx danger ci --failOnErrors --verbose"
	}
}

最后我们在CICD上，配置下流水线，可以自定义跑一个脚本命令，仅当提交MR的时候触发执行。执行脚本npm run danger。它会自动去根目录下寻找dangerfile.js/ts文件（默认是根目录），然后执行它。

添加--failOnErrors参数的目的：

1. 当我们自定义一些规则，发现代码不满足的时候 ，如果我们调用了fail函数，并且添加了--failOnErrors参数，那么CICD流程就会中断失败。

二. 测试

比如我写一个规则，禁止代码里出现console.log：

import { message, danger, fail } from 'danger';
const {
  git: { created_files: createdFiles, modified_files: modifiedFiles, deleted_files: deletedFiles },
} = danger;

const fileChanges = [ ...modifiedFiles, ...createdFiles, ...deletedFiles ];
// 检测console.log
const checkConsole = async () => {
  const consoleLogRegex = /console\.log/g;

  // 获取本次提交的代码变化
  for (const file of fileChanges) {
    const diff : any = await danger.git.diffForFile(file);
    if (diff && (consoleLogRegex.test(diff.added) || consoleLogRegex.test(diff.modified))) {
      // 判断代码变化中是否包含 console.log
      fail('The code contains console.log, please delete it and submit it');
    }
  }
};

checkConsole();

然后我程序里面随便写一个console.log，提交merge的时候就会有如下评论：

对应的流水线就会强制失败：

好处：

1. 我们可以通过DangerJs给每个MR添加对应的标签。如上图的web标签。
2. 提交MR的时候，MR列表里面就可以观察到有人评论，也就是右上角
3. 如果提交了不符合规范的代码，流程就会强制中断，做到拦截。
4. 如果配合Gitlab的merge_request_templates模板使用，就会更加合规合理。比如我们在模板里面写一写CheckList。比如开发人员提交MR的时候，是否自己review过代码？如果做过了，就将这个CheckList打钩。否则我们可以通过DangerJs，编写规则，让其不通过。