为什么要对git commit进行规范化。
Git 每次提交代码，都要写 Commit message（提交说明），否则就不允许提交。
git commit -m "hello world"
上面代码的-m参数，就是用来指定 commit mesage 的。
如果一行不够，可以只执行git commit，就会跳出文本编辑器，让你写多行。
git commit
基本上，你写什么都行。
但是，一般来说，commit message 应该清晰明了，说明本次提交的目的。
目前，社区有多种 Commit message 的写法规范，较为流行的还是Angular规范。
格式化Commit message的好处。
1、可以提供更多的历史信息，方便快速浏览git log --pretty=format:"%an - %s"。
2、可以过滤某些commit（比如新增功能），便于快速查找信息git log --grep feat。
3、使用工具conventional-changelog可以直接从commit生成Change log。
在项目中安装commitizen及commitizen脚手架工具。
npm install -D commitizen cz-customizable
全局安装commitizen，这样通过commitizen提供的命令在package.json文件中生成相应配置内容。
npm install -g commitizen
然后，在项目目录里，运行下面的命令，使其支持 Angular 的 Commit message 格式。
commitizen init cz-conventional-changelog --save --save-exact
将配置修改为如下内容。
// package.json
// ……
"config": {
"commitizen": {
"path": "node_modules/cz-customizable"
},
"cz-customizable": {
"config": "cz-config.js"
}
}
// ……
新建cz-config.js，可以使用如下代码，也可参考官方示例：
cz-customizable/cz-config-EXAMPLE.js at master · leoforfree/cz-customizable · GitHub
module.exports = {
types: [
{ value: 'feat', name: 'feat: 开发新功能。' },
{ value: 'fix', name: 'fix: 修复bug，需在脚注中注明bug号。' },
{ value: 'docs', name: 'docs: 文档修改。' },
{ value: 'style', name: 'style: 格式化代码或不会产生任何影响。' },
{
value: 'refactor',
name: 'refactor: 既不修复bug也不添加特性的代码更改'
},
{ value: 'perf', name: 'perf: 提高性能的代码更改。' },
{ value: 'test', name: 'test: 添加缺失的测试。' },
{ value: 'chore', name: 'chore: 对构建过程或辅助工具和库的更改。' },
{ value: 'revert', name: 'revert: 恢复到提交。' },
{ value: 'WIP', name: 'WIP: 正在进行中。' }
],
messages: {
type: "Select the type of change that you're committing:",
scope: '\nDenote the SCOPE of this change (optional):',
customScope: 'Denote the SCOPE of this change:',
subject: 'Write a SHORT, IMPERATIVE tense description of the change:\n',
body: 'Provide a LONGER description of the change (optional). Use "|" to break new line:\n',
breaking: 'List any BREAKING CHANGES (optional):\n',
footer:
'List any ISSUES CLOSED by this change (optional). E.g.: #31, #34:\n',
confirmCommit: 'Are you sure you want to proceed with the commit above?'
},
allowCustomScopes: true,
skipQuestions: ['body'],
subjectLimit: 100
}
以后，凡是用到git commit命令，一律改为使用git cz。这时就会shell命令交互的形式选择对应的信息来生成符合格式要求的 Commit message。
版本提交命令既可以用git commit也可以使用新增的git cz命令，根据git cz交互命令的提示我们可以很简单的生成符合Commit message合格式要求的提交请求，当然可以继续使用git commit进行版本提交的，但是我们会阻止不符合Commit message合格式要求的提交请求。
所以，接下来我们需要通过git hooks中的commit-msg配合commitlint实现对不符Commit message合格式要求的提交请求进行拦截。
首先在项目中安装commitlint相关工具。
npm install --save-dev @commitlint/config-conventional @commitlint/cli
在根目录下执行如下命令，生成commitlint配置文件。
echo "module.exports = { extends: ['@commitlint/config-conventional'] };" > commitlint.config.js
修改commitlint.config.js文件，添加对应规则。
module.exports = {
extends: ['@commitlint/config-conventional'],
rules: {
'type-enum': [2, 'always', ['feat', 'fix', 'docs', 'style', 'refactor', 'perf', 'test', 'chore', 'revert', 'WIP']],
'subject-case': [0],
},
};
安装git hooks管理工具husky，并生成相应文件。
相关配置文件及内容可以参考huskyGitHub仓库相关配置。
GitHub - typicode/husky: Git hooks made easy 🐶 woof!
npm install husky --save-dev
npx husky install
添加commit-msghooks文件。
npx husky add .husky/commit-msg
并写入如下内容。
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
npx --no -- commitlint --edit ${1}
lint-staged配合git hooks可实现在代码提交之前进行格式化。不过需要EsLint及Prettier等编码规范相关的工具配合。
npm install --save-dev lint-staged
在package.json文件中加入如下内容。
如果是Vue项目，我们可以将格式化工具修改为vue-cli-service，或其他格式化程序。
格式化之后的程序应加入到缓存去，因此最后也应该执行git add。
// package.json
// ……
"lint-staged": {
"src/**/*.{js,ts,tsx,vue,css,scss}": [
"npm run lint",
"npm run format",
"git add"
]
},
// ……
新增git hooks文件pre-commit。
npx husky add .husky/pre-commit
并写入如下内容。
#!/usr/bin/env sh
. "$(dirname "$0")/_/husky.sh"
npx lint-staged
至此我们就已经实现了，在进行代码提交时对Commit Message的格式校验及编码规范验证及修复。
参考文章：
Commit message 和 Change log 编写指南 - 阮一峰的网络日志
GitHub - ht1131589588/commitlint-cli: a cli for create commitlint at program
GitHub - typicode/husky: Git hooks made easy 🐶 woof!