其实commit规范不管是前端还是后端也好,我觉得吧,在任何的工程化的项目中都是不可或缺的部分啦,commit 提交不规范,项目维护和管理起来是极其麻烦的,毕竟每个人都具有自己的个性,commit message的格式也是参差不齐
git 可以帮我们很好地管理代码,但是在多人合作的时候,经常会碰到各种随意的 commit message,当你需要会看 commit message 的时候,就会很头疼。
幸运的是我们可以使用工具去处理掉这个问题,不让这种小问题影响到项目的进展
首先来看一下被业界广泛认可的 Angular commit message规范。
<type>(<scope>): <subject>
<BLANK LINE>
<body>
<BLANK LINE>
<footer>
一个 commit message 由三部分构成:
标题行: 必填, 描述主要修改类型和内容
主题内容: 描述为什么修改, 做了什么样的修改, 以及开发的思路等等
页脚注释: 放 Breaking Changes 或 Closed Issues
在这三部分中,<>中的内容分别表示:
type: commit 的类型
- feat: 新特性
- fix: 修改问题
- refactor: 代码重构
- docs: 文档修改
- style: 代码格式修改, 注意不是 css 修改
- test: 测试用例修改
- chore: 其他修改, 比如构建流程, 依赖管理.
- pref: 性能提升的修改
- build: 对项目构建或者依赖的改动
- ci: CI 的修改
- revert: revert 前一个 commit
scope: commit 影响的范围, 比如: route, component, utils, build…
subject: commit 的概述, 建议符合 50/72 formatting
body: commit 具体修改内容, 可以分为多行, 建议符合 50/72 formatting
footer: 一些备注, 通常是 BREAKING CHANGE 或修复的 bug 的链接.
这时候我们需要工具像 lint 检查一样来帮我们约束 commit message 的书写。
第一步:安装工具和适配器(规范)
commitizen/cz-cli
, 我们需要借助它提供的 git cz
命令替代我们的 git commit
命令, 帮助我们生成符合规范的 commit message.
除此之外, 我们还需要为 commitizen
指定一个 Adapter(适配器) 比如: cz-conventional-changelog
(一个符合 Angular团队规范的 preset). 使得 commitizen
按照我们指定的规范帮助我们生成 commit message.
全局安装 commitizen
npm install -g commitizen
npm install -g cz-conventional-changelog
第二步:项目中配置使用
在项目里安装:
先(没有package.json文件的情况下)
npm init --y
再
commitizen init cz-conventional-changelog --save --save-exact
此时看下项目中的package.json文件,会发现多出一部分配置信息
"devDependencies": {
"cz-conventional-changelog": "^3.3.0"
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
}
第三步:使用git cz替代git commit
以后,凡是用到git commit命令,一律改为使用git cz。这时,就会出现选项,用来生成符合格式的 Commit message。
**注意:**使用之前,确保根目录下有.gitignore
这个文件并且配置把node_modules
目录pass
掉,不然git add .
的时候会卡死
执行git cz:
选择一个fix作为测试:
翻译下意思就是说:
1.选择你要提交更改的类型
2.这个提交变化的范围(你的提交改动了哪些内容的意思)
3.写一篇简短的的描述,严谨的描述下这次的变化
4.提供下详细的变更描述
5.这个提交有破坏性的变化吗?
6.这个变化会影响一些开放的issue吗?
查看一下测试的结果:
还没完
总有人不走规范路:
但还是总有人不走git cz命令去commit,比如下面的例子:
不按规定使用git cz,而使用了原生的commit 提交
,这也能commit提交上去,导致了commit message信息的不统一,怎么办?
实现原理:
通过husky在.git目录中埋点hooks脚本,在提交时,通过commitlint对提交信息做校验,或通过commitizen模板生成规范的提交信息,如果需要版本日志,可以通过changelog生成修改日志。
commitlint的使用: 校验你的 message
使用commitlint工具约束commit message,如果监测到开发者commit message内容的格式没有按照规范来,此次commit 不允许通过
,比较狠,直接抑制你的个性,同样的, 它也需要一份校验的配置, 这里推荐 @commitlint/config-conventional (符合 Angular团队规范).
安装: 这个比较坑,我安装了几次才成功,可能因为外网的原因吧
npm i -D @commitlint/config-conventional @commitlint/cli
之后你的package.json会多出一部分的配置
接着在项目的根目录下新建commitlint.config.js
文件,然后写入:
module.exports = {
extends: ['@commitlint/config-conventional']
}
husky的安装:在.git目录中埋点hooks脚本
npm i husky
安装完后,需要配置package.json,往里面添加:
"husky": {
"hooks": {
"commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
}
}
配置完毕,git add .
,再试着通过git commit -m ""
不规范提交一下吧:
成功拒绝掉了不规范的commit,达到强制规范化的目的,只有通过git cz
规范的设置commit message
才能成功commit
上去