[前端工程化配置] 使用commitlint校验git commit message

1,508 阅读1分钟

前言

commitlint的自动触发依赖husky,husky的安装使用请参考: [前端工程化配置] husky + lint-staged 格式化git提交代码

commitlint和Commitizen搭配使用,效果更加哦:[Git] 使用Commitizen规范git commit信息

一、安装 @commitlint/cli 和 @commitlint/config-conventional

// 在项目根目录执行
pnpm add @commitlint/cli @commitlint/config-conventional -D
// 或者用npm
npm i @commitlint/cli @commitlint/config-conventional -D

二、添加配置文件 commitlint.config.js

在项目的根目录创建commitlint.config.js文件,用于配置commitlint校验规则。

module.exports = {
  extends: ['@commitlint/config-conventional'], // 检测规则
  rules: {}
}

配置文件的写法和eslint的配置文件写法比较类似:

  • 通过extends字段加载社区共享的校验规则,这里我们用的是@commitlint/config-conventional; 官方也给出了常见的校验规则

    image.png

  • 通过rules字段进行规则自定义

    具体的rules可以查看官网

三、package.json中添加commitlint指令

// package.json文件
scripts:{
    "commitlint": "commitlint --config commitlint.config.js -e -V",
    ...
}

四、添加commit-msg hooks

npx husky add .husky/commit-msg 'npm run commitlint'

好了,终于配置完成了,现在来试一下效果吧;

通过git commit提交,随便填写commit信息试试看:

image.png

我们再试试按照规范填写commit信息:

image.png