husky + lint-staged + commitlint 对 git 提交信息和代码格式进行验证

husky：你可以用它来检测你的提交消息、运行测试、检测代码等等。当你承诺或推动。Husky支持所有Git钩子。

lint-staged：在代码提交前对暂存区里的代码进行检测。

commitlint：对你的提交信息进行检测 （ git commit -m）

版本： 

"husky": "^8.0.1",
"lint-staged": "^13.0.2",
"@commitlint/cli": "^17.0.2",

注意：

由于v13.0.0, lint- staging不再支持Node.js 12。请升级你的Node.js版本到14.13.1或16.0.0以上。

1. 安装 husky

执行：

npm install husky --save-dev

2. 使用 git 钩子

npx husky install

执行之后会在根目录新增一个 .husky 的文件夹

3. 要在安装后自动启用 Git 挂钩，编辑 package.json

// 在 package.json 文件的 scripts 内新增 "prepare": "husky install"
{
  "scripts": {
    "prepare": "husky install"
  }
}

4. 安装 lint-staged 

执行：

npm install lint-staged --save-dev

 5. 编辑 package.json 

// 在 package.json 文件内修改
// 这个是要针对你要提交的所有文件执行的命令
{
  "lint-staged": {
    "*": "npm run lint"
  } 
}


// 如果你所在的项目是执行 eslint --fix 进行文件格式校验
// 就把命令改为 eslint --fix

{
  "lint-staged": {
    "*": "eslint --fix"
  } 
}



// 如果只需要对 js 文件进行校验就将 key 改为 "*.js"
// 就把命令改为 eslint --fix

{
  "lint-staged": {
    "*.js": "eslint --fix"
  } 
}



// 也可以是不同文件执行不同命令

{
  "lint-staged": {
    "*.js": "eslint --fix",
    "*.css": "xxxxx"  // 比如你的 css 格式校验命令
  } 
}

6. 创建 pre-commit 命令挂载到钩子上

 官方文档上是要执行 npx husky add .husky/pre-commit "npm test" 去创建，但是我执行后并没有创建出来，就手动在 .husky 目录下建了个 pre-commit 文件，文件内容为：

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

npx lint-staged

 7. 安装 commitlint

npm install -g @commitlint/cli @commitlint/config-conventional

 8. 添加配置文件

在根目录下添加 commitlint.config.js 文件，内容为：

module.exports = {
  extends: ['@commitlint/config-conventional']
}

 使用的是 @commitlint/config-conventional 这一套规则，如果需要自定义规则，可以 在 plugins 写一个插件，然后在 rules 内使用：

module.exports = {
  rules: {
    'commit-rule': [2, 'always']
  },
  plugins: [
    {
      rules: {
        'commit-rule': ({ raw }) => {
          return [
            /^\[(feat|fix|docs|style|build|revert)].+/g.test(raw),
            `commit备注信息格式错误，格式为 <[type] 修改内容>，type支持${types.join(',')}`
          ]
        }
      }
    }
  ]
}

 9.  创建 commit-msg 命令挂载到钩子上

同样，官网让执行  npx husky add .husky/commit-msg 'npx --no -- commitlint --edit "$1"' 来添加文件 commit-msg 文件，但是我还是没创建出来，就手动在 .husky 目录下添加了 commit-msg 文件，文件内容为：

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

npx --no -- commitlint --edit "${1}"

走到这一步就基本上完成了，这个时候执行 git commit -m 'fix: 改了xxx' 命令的时候，格式如果错了就会被拦截下来了：

两个实例，一个 代码内有错误，一个commit格式不规范

项目中使用 gerrit 的同学可能还有一个坑 

报错  ERROR: commit dbf44af: missing Change-Id in message footer，

commit-msg  文件内 加入下面代码即可

if [ -f .git/hooks/commit-msg ]; then
  . ".git/hooks/commit-msg"
fij