commitizen + husky 規範git提交信息

前言

你是否有過這樣的體驗:node

  1. 快下班了,提交代碼趕忙溜,一頓啪啪啪,(git add .)(git commit -m "吧拉吧啦")(git push);
  2. 修改的東西有點雜,,不知道提交信息寫啥,又是一頓啪啪啪,好了提交了;
  3. 提交一時爽,查找淚兩行,想尋當時的某次修改發現無從下手。。。。

有什麼需求,就有什麼工具,針對這些問題,如今業界用的最多的就是Angular團隊使用的規範;經過git commit的時候彈出一個vim編輯器來編輯模板類型的一份提交信息,主要格式以下:git

<type>(<scope>):<subject>
<BlLANK_LINE>
<?body>
<BLANK_LINE>
<?footer>複製代碼

  • 第一行爲必填項:主要就是 【提交類型(影響範圍):簡要描述】
  • body爲詳細描述,我的沒怎麼用過
  • 頁腳爲破壞性改變或者關閉了某個issues

安裝

我的習慣針對於項目設置,因此直接在項目安裝,而非全局配置,原理同樣npm

$ npm i -D commitizen cz-conventional-changelog
$ npm i -g commitizen cz-conventional-changelog複製代碼

### package.json

"config":{
    "commitizen":{
        "path":"node_modules/cz-conventional-changelog"
    }
}複製代碼

這裏若是你是使用全局模式安裝的話須要在全局根目錄下創建.czrc文件,而後文件中輸入內容{「path」:"cz-conventional-changelog"}或者鍵入以下命令:json

echo '{"path":"cz-conventional-changelog"}' > ~/.czrc複製代碼

若是你是使用全局安裝的那麼如今你到項目目錄下使用git cz命令就能夠看到vim編輯器的彈出內容了,若是是項目級安裝,能夠到package.json中的scripts命令中配置一條運行命令便可(type的具體類型配置文件介紹)vim

"scripts":{
    commit:"git-cz"
}複製代碼


選擇了提交類型後,會讓你繼續選擇代碼的影響範圍bash


選擇完影響範圍後會讓你依次填寫簡要信息,詳細信息,頁腳信息,是否提交(不一一律述了,都是寫完enter鍵下一步)編輯器

commitlint校驗

進行了上面的操做,其實對於一個自覺地人來講,已經夠了,可是沒有約束就表明了自由,自由就有人越界,我若是不按約束提交,照樣玩的嗨起,那麼怎麼給這些自由加一些約束呢?工具

$ npm i -D @commitlint/config-conventional @commitlint/cli複製代碼

在項目更目錄下創建配置文件 commitlint.config.js 或者 .commitlintrc.js測試

module.exports = {
    extents:[
        "@commitlint/config-conventional"
    ],
    rules:{
    }
}複製代碼

你可使用官網的方式測試一下你的提交是否符合規範ui



Husky限制

結合git hook來檢驗commit message,這樣當你的提交不符合規範時就會阻止你提交

$ npm i -D husky複製代碼

package.json

"husky": {
    "hooks": {
      "commit-msg": "commitlint -e $GIT_PARAMS"
    }
  }複製代碼

這樣當你有不符合規範的時候你將提交不了(我這裏是scope爲空,拒絕提交)


自定義提交規範

固然大家若是想本身定義提交規範也是能夠的,首先要下載自定義規範約束的包替換Angular團隊使用的規範。

$ npm i -D commitlint-config-cz  cz-customizable
###而且在項目根目錄建立cz-config.js複製代碼

commitlint.config.js(rules爲我自定義的規則)

module.exports = {    
    extends: [        
        '@commitlint/config-conventional',
        'cz'    
    ],
     rules:{
      // Header 
     'header-max-length': [2, 'always', 200],
      // <type>枚舉
      'type-enum': [2, 'always', [
        'init',
        'feat',
        'fix',
        'ui',
        'refactor',
        'replace',
        'deploy',
        'docs',
        'test',
        'chore',
        'style',
        'revert',
        'add',
        'minus',
        'del'
      ]],
      // <type> 不能爲空
      'type-empty': [2, 'never'],
      // <type> 格式 小寫 
     'type-case': [2, 'always', 'lower-case'],
      // <scope> 不能爲空
      'scope-empty': [2, 'never'],
      // <scope> 格式 小寫
      'scope-case': [2, 'always', 'lower-case'],
      // <subject> 不能爲空
      'subject-empty': [2, 'never'],
      // <subject> 以.爲結束標誌
      'subject-full-stop': [2, 'never', '.'],
      // <subject> 格式
      // 可選值
      // 'lower-case' 小寫 lowercase
      // 'upper-case' 大寫 UPPERCASE
      // 'camel-case' 小駝峯 camelCase
      // 'kebab-case' 短橫線 kebab-case
      // 'pascal-case' 大駝峯 PascalCase
      // 'sentence-case' 首字母大寫 Sentence case
      // 'snake-case' 下劃線 snake_case
      // 'start-case' 全部首字母大寫 start-case
      'subject-case': [2, 'never', []],
      // <body> 以空行開頭
      'body-leading-blank': [1, 'always'],
      // <footer> 以空行開頭
      'footer-leading-blank': [1, 'always']
    }}複製代碼

package.json

"config": {
    "commitizen": {
      "path": "node_modules/cz-customizable"
    }
  },複製代碼

cz-config.js(這是我自定義的配置)

module.exports = {
  types: [
    {      value: 'init',      name: 'init: 初始提交'    },
    {      value: 'feat',      name: 'feat: 增長新功能'    },
    {      value: 'fix',      name: 'fix: 修復bug'    },
    {      value: 'ui',      name: 'ui: 更新UI'    },
    {      value: 'refactor',      name: 'refactor: 代碼重構'    },
    {      value: 'release',      name: 'release: 發佈'    },
    {      value: 'deploy',      name: 'deploy: 部署'    },
    {      value: 'docs',      name: 'docs: 修改文檔'    },
    {      value: 'test',      name: 'test: 增刪測試'    },
    {      value: 'chore',      name: 'chore: 更改配置文件'    },
    {      value: 'style',      name: 'style: 樣式修改不影響邏輯'    },
    {      value: 'revert',      name: 'revert: 版本回退'    },
    {      value: 'add',      name: 'add: 添加依賴'    },
    {      value: 'minus',      name: 'minus: 版本回退'    },
    {      value: 'del',      name: 'del: 刪除代碼/文件'    }
  ],
  scopes: [],
  messages: {
    type: '選擇更改類型:\n',
    scope: '更改的範圍:\n',
    // 若是allowcustomscopes爲true,則使用
    // customScope: 'Denote the SCOPE of this change:',
    subject: '簡短描述:\n',
    body: '詳細描述. 使用"|"換行:\n',
    breaking: 'Breaking Changes列表:\n',
    footer: '關閉的issues列表. E.g.: #31, #34:\n',
    confirmCommit: '確認提交?'
  },
  allowCustomScopes: true,
  allowBreakingChanges: ["feat", "fix"]};複製代碼


最後:若是你以爲對你有幫助,留下個腳印吧!若是你以爲文章有問題,留下點意見吧!

相關文章
相關標籤/搜索