JS - DangerJs运用
- 前言
- 一. 前期准备
- 1.1 创建私有 Token
- 1.2 Git 设置对应的 Token 以及 Host 环境变量
- 1.3 项目安装 dangerJs
- 二. 测试
前言
在开源社区中,DangerJs
可以拿来自动判断每个人提交的代码合并请求(github
中叫Pull Request
,简称PR
,gitlab
中叫Merge Request
,下文简称MR
)是否符合规范,自动化一些费时费力的人工检查,从而保证代码质量,是项目管理的利器。
一. 前期准备
1.1 创建私有 Token
拥有自己的github
账号,最好是一个共用的机器人账号。以github
为例,我们创建自己的私有Token
。地址。备注:如果是gitlab
,就去gitlab
上创建。
如图:
创建好后,记得备份生成的秘钥:只会生成一次。后续看不到了。
1.2 Git 设置对应的 Token 以及 Host 环境变量
以Gitlab
为例(内网):
- 记得将机器人账号加入到项目A中。
- 进入项目A中,点击左侧的
Settings --> CI/CD
。
- 选择
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
参数的目的:
- 当我们自定义一些规则,发现代码不满足的时候 ,如果我们调用了
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
的时候就会有如下评论:
对应的流水线就会强制失败:
好处:
- 我们可以通过
DangerJs
给每个MR
添加对应的标签。如上图的web标签。 - 提交MR的时候,MR列表里面就可以观察到有人评论,也就是右上角
- 如果提交了不符合规范的代码,流程就会强制中断,做到拦截。
- 如果配合
Gitlab
的merge_request_templates
模板使用,就会更加合规合理。比如我们在模板里面写一写CheckList
。比如开发人员提交MR的时候,是否自己review
过代码?如果做过了,就将这个CheckList
打钩。否则我们可以通过DangerJs
,编写规则,让其不通过。