前端工程化之用commintlint + husky實現git提交規範化

在咱們團隊協做開發時，若是每一個人的git的commit提交規範都不同，最後的代碼review或看git的log提交記錄時就是一團亂，今天咱們用commit + husky實現git提交規範化，保證錯誤的commit信息不能提交成功。

1、在項目中安裝commitlint

1. 安裝依賴

npm install --save-dev @commitlint/{cli,config-conventional}
複製代碼

2. 生成配置文件

echo "module.exports = {extends: ['@commitlint/config-conventional']};" > commitlint.config.js
複製代碼

commitlint是檢測咱們提交的規範的，具體規範以下：

type(scope?): subject
body?
footer?
複製代碼

其中type和subject是必需的，其餘是可選的，type 用於說明 commit 的類別，也能夠本身在配置文件中更改或者擴展。subject是 commit 目的的簡短描述，不能超過50個字符，且結尾不加英文句號。

type的類型以下：

feat：新功能（feature）
fix：修補bug
docs：文檔（documentation）
style： 格式方面的優化
refactor：重構
test：測試
chore：構建過程或輔助工具的變更
複製代碼

2、在項目中安裝husky

husky可以實現 git hooks ，就是在咱們使用 git 命令的時候，執行一些操做等，如這裏就是在 git commit 時執行commitlint規範檢測。

1. 安裝依賴

npm install --save-dev husky
複製代碼

2. 在 package.json 中配置

// package.json
{
  "husky": {
    "hooks": {
      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS"
    }  
  }
}
複製代碼

3、最後咱們來項目中測試下

$ git commit -m "add: first"
husky > commit-msg (node v12.16.2)
⧗   input: add: first
✖   type must be one of [build, chore, ci, docs, feat, fix, improvement, perf, refactor, revert, style, test] [type-enum]

✖   found 1 problems, 0 warnings
ⓘ   Get help: https://github.com/conventional-changelog/commitlint/#what-is-commitlint

husky > commit-msg hook failed (add --no-verify to bypass)
複製代碼

執行了

git commit -m "add: first"
複製代碼

但其實它並不符合咱們 commitlint 的規範，因此並無經過，報錯了，到此 commitlint 的使用就完成了，看完的小夥伴記得動手操做一遍哦，有不懂得也能夠留言哦！