快捷導(dǎo)航

git提交驗(yàn)證規(guī)范并自動(dòng)生成日志文件的方法

更新時(shí)間：2020年11月06日 11:18:11 作者：?jiǎn)柊?

這篇文章主要介紹了git提交驗(yàn)證規(guī)范并自動(dòng)生成日志文件的相關(guān)知識(shí)，本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下

每次git提交信息的時(shí)候會(huì)先驗(yàn)證提交的格式是否符合規(guī)范，符合規(guī)范并運(yùn)行eslint
兩者都符合之后才可正常提交，并可以根據(jù)提交的信息自動(dòng)生成日志信息。
一般是遵循 Angular Commit Message

校驗(yàn)commit 格式

主要使用 @commitlint/cli @commitlint/config-conventional 來校驗(yàn)commit是否符合規(guī)范一般可以全局安裝or本地安裝

install

全局

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

本地

npm install --save-dev @commitlint/cli @commitlint/config-conventional

如果是全局可以使用下面這條命令查看全局有沒有安裝成功

npm ls -g -depth=0

生成配置文件

在項(xiàng)目根目錄下運(yùn)行下面這個(gè)命令生成對(duì)應(yīng)的配置文件

touch commitlint.config.js

文件內(nèi)容一般可以設(shè)置如下:

module.exports = {
 extends: ['@commitlint/config-conventional'],
 rules: {
 'type-enum': [2, 'always', [
  "feat", "fix", "docs", "style", "refactor", "test", "chore", "revert"
 ]],
 'subject-full-stop': [0, 'never'],
 'subject-case': [0, 'never']
 }
};

husky

一般校驗(yàn)規(guī)則設(shè)置好之后會(huì)結(jié)合husky提供的鉤子，在每次commit之前會(huì)先去校驗(yàn)，如果不符合校驗(yàn)規(guī)則，則提交失敗
husky 繼承了git下所有的鉤子，需要注意在使用husky之前，先git init 一下，否則沒有 .git文件，就沒法繼承g(shù)it的鉤子了
如果項(xiàng)目中刪除了.git 文件，那需要在git init之后重新安裝一下husky否則就不work了

install

npm install husky --save-dev

config

在package.json中添加配置

"husky": {
 "hooks": {
  "commit-msg": "commitlint -e $GIT_PARAMS"
 }
 }

至此，每次提交如果不符合規(guī)范就會(huì)提交失敗，類似下面這種提示

在這里插入圖片描述

commitizen

一個(gè)輔助工具，可以讓我們寫出一個(gè)符合規(guī)范的commit信息。
通過交互式的命令，我們可以寫出符合規(guī)范的commit.可以全局安裝

install

npm install -g commitizen

安裝之后在需要使用git commit的地方使用git cz 代替，就會(huì)出現(xiàn)交互式命令行窗口，直接選擇對(duì)應(yīng)的選項(xiàng)讓后填寫即可
如下：

在這里插入圖片描述

lint-staged

這個(gè)工具好像和提交沒有太大關(guān)系，但一般也都會(huì)用到，所以這里順帶提一下，這個(gè)是每次提交的時(shí)候讓eslint只驗(yàn)證自己這次所改動(dòng)的代碼，對(duì)于其他代碼則不會(huì)去lint。
不至于每次提交都會(huì)對(duì)所有的文件呢lint.

install

npm i --save-dev lint-staged

config

在package.json中配置下：

 "husky": {
 "hooks": {
  "pre-commit": "lint-staged",
  "commit-msg": "commitlint -e $HUSKY_GIT_PARAMS"
 }
 }

當(dāng)然這里假定你的項(xiàng)目中有關(guān)eslint的其他配置都已近配置好了。也可以加上prettierrc去格式化代碼，這里就不加了
上面的配置會(huì)在每次提交之前對(duì)所改動(dòng)的代碼進(jìn)行l(wèi)int

自動(dòng)生成日志文件

主要使用到 conventional-changelog 工具來幫助我們自動(dòng)生成日志文件

install

一般這種工具可以全局安裝一下比較方便

npm install -g conventional-changelog

只安裝上面的運(yùn)行相關(guān)命令會(huì)報(bào)錯(cuò)，安裝下對(duì)應(yīng)的cli

npm install -g conventional-changelog-cli

同樣可以使用下面這條命令查看是否安裝成功

npm ls -g -depth=0

在這里插入圖片描述

自動(dòng)生成日志

沒問題之后在項(xiàng)目的根目錄下運(yùn)行下列命令

conventional-changelog -p angular -i Changelog.md -s

當(dāng)然也可以在package.json中配置成一個(gè)命令，這樣就很方便

"scripts": {
 "changelog": "conventional-changelog -p angular -i Changelog.md -s"
 },

這樣每次運(yùn)行下面這條命令即可在項(xiàng)目根目錄自動(dòng)生成對(duì)應(yīng)的日志文件

npm run changelog

當(dāng)然上述的changelog.md是生成的文件名，你也可以該成自己期望的文件名

在這里插入圖片描述

總結(jié)

總結(jié)一下用這套工具容易出錯(cuò)的幾個(gè)地方吧。

1.一個(gè)是使用husky之前需要git init一下，如果刪除了項(xiàng)目中的.git文件夾，雖然此時(shí)已近安裝過了husky，在重新git init之后依然需要重新安裝一下husky否則繼承不了git的鉤子，就不work

2.針對(duì)上面的第一條，有的時(shí)候按照套路來，可就是會(huì)發(fā)現(xiàn)會(huì)報(bào)一個(gè)這個(gè)錯(cuò)誤
這個(gè)時(shí)候可以查看本地項(xiàng)目中 .git有木有hooks文件，如果沒有那說明husky沒有繼承g(shù)it，如果有的話就rm -rf .git/hooks然后重新安裝下husky。這是一個(gè)closed issue

在這里插入圖片描述