本文已参与「新人创作礼」活动，一起开启掘金创作之路。

前端自动化 之 Husky+Commitlint 篇 (四)

Commitlint定制提交规范

commitlint是什么： 当我们运行 git commmit -m 'xxx' 时，用来检查 xxx 是否满足固定格式的工具。
为什么使用commitlint：团队中规范了 commit 规范可以更清晰的查看每一次代码提交记录，还可以根据自定义的规则，自动生成 changeLog 文件。

pnpm i @commitlint/config-conventional @commitlint/cli -D

@commitlint/cli 是commitlint提供的命令行工具，安装后会将cli脚本放置在./node_modules/.bin/目录下
@commitlint/config-conventional 是社区中一些共享的配置，我们可以扩展这些配置，也可以不安装这个包自定义配置，Commitlint 推荐我们使用 config-conventional 配置去写 commit

定制提交格式

git commit -m <type>(optional scope): <subject>

type: 用于表明我们这次提交的改动类型，是新增了功能？还是修改了测试代码？又或者是更新了文档？
optional scope: 一个可选的修改范围。用于标识此次提交主要涉及到代码中哪个模块。
subject: 一句话描述此次提交的主要内容，做到言简意赅。

常用的Type类别

类型	描述
build	编译相关的修改，例如发布版本、对项目构建或者依赖的改动
chore	其他修改, 比如改变构建流程、或者增加依赖库、工具等
ci	持续集成修改
docs	文档修改
feat	新特性、新功能
fix	修改bug
perf	优化相关，比如提升性能、体验
refactor	代码重构
revert	回滚到上一个版本
style	代码格式修改, 注意不是 css 修改
test	测试用例修改

创建一个钩子

npx husky add .husky/commit-msg 'npx --no-install commitlint --edit "$1"' 

commit-msg 脚本内容如下：

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx --no-install commitlint --edit "$1"

commitlint.config.js 规则内容如下：

/*
 * @Description: commit-msg提交信息格式规范
 *
 * commit-msg格式: <type>(scope?): <subject>
 *  - type: 用于表明我们这次提交的改动类型，是新增了功能？还是修改了测试代码？又或者是更新了文档？
 *    - build: 编译相关的修改，例如发布版本、对项目构建或者依赖的改动
 *    - chore: 其他修改, 比如改变构建流程、或者增加依赖库、工具等
 *    - ci: 持续集成修改
 *    - docs: 仅文档新增/改动 （documentation）
 *    - feat: 新特性、新功能（feature）
 *    - fix: 修改bug（fixbug）
 *    - optimize: 优化构建工具或运行时性能
 *    - perf: 优化相关，比如提升性能、体验
 *    - refactor: 代码重构
 *    - revert: 回滚到上一个版本
 *    - style: 代码格式修改, 注意不是 css 修改
 *    - test: 测试用例修改
 *    - update: 更新某功能
 *  - scope：一个可选的修改范围。用于标识此次提交主要涉及到代码中哪个模块。
 *  - Subject：一句话描述此次提交的主要内容，做到言简意赅
 */
const type = [
  'build',
  'chore',
  'ci',
  'docs',
  'feat',
  'fix',
  'optimize',
  'perf',
  'refactor',
  'revert',
  'style',
  'test',
  'update',
]
module.exports = {
  ignores: [(commit) => commit.includes('init')],
  extends: ['@commitlint/config-conventional'],
  rules: {
    'type-empty': [2, 'never'], // <type> 不能为空
    'type-enum': [2, 'always', [...type]], // <type> 规定使用类型
    'type-case': [0],
    'scope-empty': [0], // <scope> 可为空
    'subject-empty': [2, 'never'], // <subject> 不能为空 (默认)
    'subject-full-stop': [2, 'never', '.'], // <subject> 结尾不加'.'
    'subject-case': [0],
    'header-max-length': [2, 'always', 72], // header最大72个字符
    'body-leading-blank': [1, 'always'], // body上面要有换行
    'footer-leading-blank': [1, 'always'], // footer上面要有换行
  },
}