乐趣区

手把手教你结合commitizen 搭建属于自己的项目git commit 校验工具

先丢出最终版的 index.js 文件内容
#!/usr/bin/env node
“use strict”;
const path = require(‘path’);
const editJsonFile = require(“edit-json-file”);
const arg = process.argv
// 初始化 my-commit , 将部分脚本写入到 package.json 中
if (arg[2] && arg[2] === ‘init’) {
// If the file doesn’t exist, the content will be an empty object by default.
let file = editJsonFile(`${process.cwd()}/package.json`);
// Set a couple of fields
file.set(“husky”, {“hooks”: {
“pre-commit”: “lint-staged”
}});
file.set(“lint-staged”, {
“src/*.js”: “[‘eslint –fix’]”
});
// 询问是否全部使用 git add .
var List = require(‘prompt-list’);
var list = new List({
name: ‘order’,
message: ‘ 是否默认使用 git add .’,
// choices may be defined as an array or a function that returns an array
choices: [
‘yes’,
‘no’
]
})
// async
list.ask(function(answer) {
file.set(“scripts”, {
“my-ci”: answer === ‘yes’ ? ‘git add . && cross-env ./node_modules/.bin/my-commit’ : ‘cross-env ./node_modules/.bin/my-commit’
});
// Output the content
file.save();
var shell = require(‘shelljs’);
console.log(‘ 开始安装依赖 ’);
shell.exec(‘npm i husky –save-dev’, {async: true})
console.log(‘ 正在安装 husky—- ‘);
shell.exec(‘npm i cross-env –save-dev’, {async: true})
console.log(‘ 正在安装 cross-env —- ‘);
shell.exec(‘npm i lint-staged –save-dev’, {async: true})
})
} else {
const bootstrap = require(‘commitizen/dist/cli/git-cz’).bootstrap;
bootstrap({
cliPath: path.join(__dirname, ‘../../node_modules/commitizen’),
// this is new
config: {
“path”: “cz-conventional-changelog”,
“path”: “cz-emoji”
}
});
}
步骤
一、创建工具项目
1. 使用 git/gitlab 创建一个空的仓库
2. 在空仓库中添加 index.js 内容如下
// index.js

#!/usr/bin/env node
“use strict”;
const bootstrap = require(‘commitizen/dist/cli/git-cz’).bootstrap;
bootstrap({
cliPath: path.join(__dirname, ‘../../node_modules/commitizen’),
// this is new
config: {
“path”: “cz-conventional-changelog”
}
});
使用工具到相应的项目(假设插件名称 my-commit)
1. 先发布你的工具项目到 npm,相当于创建一个 npm 包、具体怎么发布 这里不做赘述,网上很多教程
2. 安装工具(假设插件名称 my-commit)
npm install my-commit –save-dev

3. 配置
需要在 package.json 的 script 中添加如下
// my-ci 是自己定义的写成什么都可以

“my-ci”: “./node_modules/.bin/my-commit”

4. 配置之后 执行了 git add . 之后 执行 npm run my-ci 将会出现选填补充信息的选项
如果觉得 git add. 之后再执行 npm run my-ci 有点麻烦,可以直接改成
// my-ci 是自己定义的写成什么都可以

“my-ci”: “git add. && ./node_modules/.bin/my-commit”

5 因为以上命令存在不同系统路径不兼容问题 需要加入 cross-env

npm install cross-env –save-dev

6 再次修改 package.json

// my-ci 是自己定义的写成什么都可以

“my-ci”: “git add. && cross-env ./node_modules/.bin/my-commit”

当需要提交代码的时候,不用执行 git add . 直接执行 npm run my-ci 即可
7 提示信息加上可爱的表情
需要在 index.js 文件中添加 cz-emoji 如下
// index.js

#!/usr/bin/env node
“use strict”;

const bootstrap = require(‘commitizen/dist/cli/git-cz’).bootstrap;
bootstrap({
cliPath: path.join(__dirname, ‘../../node_modules/commitizen’),
// this is new
config: {
“path”: “cz-conventional-changelog”,
“path”: “cz-emoji”
}
});

这个时候 重新发 npm 包之后再安装到自己的项目下,执行提交的时候
8 为了增强校验功能,加入 eslint 对文件进行
这个有点复杂,需要通过 lint-staged 来判断
所以先安装以下依赖
npm i husky –save-dev
npm i lint-stage –save-dev

配置 package.json
// 增加属性
“husky”: {
“hooks”: {
“pre-commit”: “lint-staged”
}
},
“lint-staged”: {
“src/*.js”: [
“eslint –fix”
]
},
// 其中 src 的具体路径是可以自己配置
// 校验规则是基于当前目录的.eslintrc.js 文件,如果有些规则不想要,就配置这个文件

这个时候我们提交代码的时候再输入基本的信息之后会执行一个 eslint 的代码规则
总结以上配置文件 我们需要
安装的库有
npm i my-commit –save-dev
npm i cross –save-dev
npm i husky –save-dev
npm i lint-stage –save-dev
需要配置 package.json 属性有
“script”: {

“my-ci”: “git add. && cross-env ./node_modules/.bin/my-commit”
},

“husky”: {
“hooks”: {
“pre-commit”: “lint-staged”
}
},
“lint-staged”: {
“src/*.js”: [
“eslint –fix”
]
},
如果每个项目都这么玩。其实有点耗时间,所以我们做了一下自动化
10 初步自动化
修改 my-commit 中的 index.js
#!/usr/bin/env node
“use strict”;
const path = require(‘path’);
const editJsonFile = require(“edit-json-file”);
const arg = process.argv
// 初始化 my-commit , 将部分脚本写入到 package.json 中
if (arg[2] && arg[2] === ‘init’) {
// If the file doesn’t exist, the content will be an empty object by default.
let file = editJsonFile(`${process.cwd()}/package.json`);
// Set a couple of fields
file.set(“husky”, {“hooks”: {
“pre-commit”: “lint-staged”
}});
file.set(“lint-staged”, {
“src/*.js”: “[‘eslint –fix’]”
});
// 询问是否全部使用 git add .
var List = require(‘prompt-list’);
var list = new List({
name: ‘order’,
message: ‘ 是否默认使用 git add .’,
// choices may be defined as an array or a function that returns an array
choices: [
‘yes’,
‘no’
]
})
// async
list.ask(function(answer) {
file.set(“scripts”, {
“my-ci”: answer === ‘yes’ ? ‘git add . && cross-env ./node_modules/.bin/my-commit’ : ‘cross-env ./node_modules/.bin/my-commit’
});
// Output the content
file.save();
var shell = require(‘shelljs’);
console.log(‘ 开始安装依赖 ’);
shell.exec(‘npm i husky –save-dev’, {async: true})
console.log(‘ 正在安装 husky—- ‘);
shell.exec(‘npm i cross-env –save-dev’, {async: true})
console.log(‘ 正在安装 cross-env —- ‘);
shell.exec(‘npm i lint-staged –save-dev’, {async: true})
})
} else {
const bootstrap = require(‘commitizen/dist/cli/git-cz’).bootstrap;
bootstrap({
cliPath: path.join(__dirname, ‘../../node_modules/commitizen’),
// this is new
config: {
“path”: “cz-conventional-changelog”,
“path”: “cz-emoji”
}
});
}

清除掉以前配置的 package.json
只要两部安装即可
npm i my-commit
npx my-commit init

提交代码的时候直接执行 npm run my-ci 即可
11 更智能(摸索中)

退出移动版