前端使用工具规范commit信息 - 空山与新雨

通过工具规范git提交信息也是工程化的一部分，在前端领域有一些工具为我们提供了相关功能，在这里做一下使用总结。

commitlint

1. commitlint是什么？
   就像eslint用来检查js代码是否标准，commitlint用来检查提交信息是否满足固定格式的工具。
   同样，commitlint提供了一些规则供我们配置。

2. commitlint怎么用？
   和eslint一样，commitlint提供了相应的api供我们调用、或者和其他工具集成
   安装：npm install -g @commitlint/cli @commitlint/config-conventional 其中@commitlint/config-conventional是常用的插件。 commitlint常用命令：

   • commitlint -e 命令就可以检查.git/COMMIT_EDITMSG里面的commit message是否符合格式；
   • commitlint -e ./aaa 命令就可以检查文件./aaa里面内容是否符合格式；
   • commitlint -E HUSKY_GIT_PARAMS 读取环境变量HUSKY_GIT_PARAMS对应的文件的内容，默是.git/COMMIT_EDITMSG

3. 配置文件 commitlint.config.js/.commitlintrc.js

   类似于.eslintrc.js文件，用来配置commitlint规则。extends字段类似于eslint的extends

   module.exports = {
     extends: ['@commitlint/config-conventional'],
     rules: {
   	'header-max-length': [2, 'always', 60],
     },
   };
   

commitizen

1. commitizen是什么？

   正常git commit 我们可以写出符合commitlint的提交信息，但是如果有命令行提示我们一步步的写就更方便了，于是出现了commitizen就是一个这样的工具。

2. commitizen怎么用？

   • npm install commitizen 之后使用 git cz 来替代 git commit 提交信息。
   • npm install cz-customizable

   cz-customizable 是可自定义的Commitizen插件，

   commitizen中有个 Commitizen friendly的概念，如果是Commitizen-friendly ,执行git cz会进入交互式操作；如果不是Commitizen-friendly就会和普通git commit一样。一般项目在没有安装相关插件的情况下不是Commitizen-friendly, 要做到Commitizen-friendly需要adapter，比如：cz-customizable 或者cz-conventional-changelog 。cz-customizable 用的更多一些。

3. 配置cz-customizable

   指定commitizen用哪个adapter：

   // package.json
   "config": {
   	"commitizen": { 
   		"path": "node_modules/cz-customizable"
   	},
   	"cz-customizable": {
   		"config": "config/path/to/my/config.js"
   	}
   }
   

   创建.cz-config.js自定义提交规则。

    - types: 描述修改的性质是什么，是bugfix还是feat，在这里进行定义。
    - scopes: 定义之后，我们就可以通过上下键去选择 scope
    - scopeOverrides: 针对每一个type去定义scope
    - allowBreakingChanges: 设置为 ['feat', 'fix']，只有我们type选择了 feat 或者是 fix，才会询问我们 breaking message.
    - allowCustomScopes: 设置为 true，在 scope 选择的时候，会有 empty 和 custom 可以选择，顾名思义，选择 empty 表示 scope 缺省，如果选择 custom，则可以自己输入信息
    - skipQuestions: 指定跳过哪些步骤，例如跳过我们刚刚说的详细描述，设置其为 scope: ['body']，假设我们的项目也不会涉及到关联 issue，我们可以设置其为 scope: ['body', 'footer']
    - subjectLimit: 描述的长度限制
   

   cz-customizable 会首先在项目根目录下寻找: .cz-config.js 或 .config/cz-config.js，如果找不到，会去主目录寻找。我们也可以在 package.json 中手动去指定配置文件的路径

可以使用commitlint做提交信息的校验， 也可以使用commitizen简化提交的负担，还可以使用husky将这些约束放到提交钩子里，这些都是在本地做的校验，开发者其实是可以跳过这些校验和约束的，那么如果要做更严格的约束就需要在远程git服务器上增加校验处理。