git commit前檢測husky與pre-commit

1、前言

如今最流行的版本管理工具非git莫屬，而良好的代碼規範有助於項目的維護，爲了防止一些不規範的代碼 commit並push到遠端,咱們能夠在git命令執行前用一些鉤子來檢測並阻止。如今大前端主要有兩種git鉤子插件：husky（jquery與next.js都在用），pre-commit(antd在用)。
下面我將現介紹一個git鉤子，再介紹下husky與pre-commit的用法

2、git鉤子

用過git的小夥伴們都知道git有不少命令commit、push、rebase等等。那這些命令主要是在執行.git文件夾中的東西，那麼git 鉤子目錄就是在.git文件夾的hooks下，以下所示：

cd .git/hooks
    ls -l

上圖爲各個鉤子的案例腳本，能夠把sample去掉，直接編寫shell腳原本執行。
而前端的小夥伴們則能夠用插件husky與pre-commit，來使鉤子生效。

注意： 通常.git爲隱藏文件，能夠把項目拖入IDE中查看,.git文件裏的內容通常不容許手動更改的。

3、husky

husky可以防止不規範代碼被commit、push、merge等等。
首先安裝husky

npm install husky --save-dev

或

yarn add husky --dev

編輯package.json文件，如：

{
  "scripts": {
    "precommit": "webpack  --config ./web/webpack.config.js",
    "...": "..."
  }
}

當你git commit的時候，將會現現執行 precommit裏的腳本，沒有問題了再提交。

具體案例可查看 https://github.com/raoenhui/create-img

4、pre-commit

pre-commit可以防止不規範代碼被commit，沒有husky這麼全面，可是你能夠接着安裝pre-push等插件來防止對應的git操做。下面以pre-commit爲例：

首先安裝pre-commit

npm install pre-commit --save-dev

編輯package.json文件，如：

"scripts": {
    "test": "echo \"Error: I SHOULD FAIL LOLOLOLOLOL \" && exit 1",
    "foo": "echo \"fooo\" && exit 0",
    "bar": "echo \"bar\" && exit 0"
  },
  "pre-commit": [
    "foo",
    "bar",
    "test"
  ]

pre-commit的配置項很是靈活，還能夠下面這樣寫：

{
  "precommit": "foo, bar, test"
  "pre-commit": "foo, bar, test"
  "pre-commit": ["foo", "bar", "test"]
  "precommit": ["foo", "bar", "test"],
  "precommit": {
    "run": "foo, bar, test",
  },
  "pre-commit": {
    "run": ["foo", "bar", "test"],
  },
  "precommit": {
    "run": ["foo", "bar", "test"],
  },
  "pre-commit": {
    "run": "foo, bar, test",
  }
}

你配置好後，執行git commit命令，它將會依次執行foo、bar、test來檢測完善代碼。

5、總結

咱們已經怎麼用git鉤子插件了，那麼咱們通常用它來作什麼呢。
prevent commit時，咱們能夠把eslint以及test命令加上，檢測代碼規範：

"scripts": {
    "precommit": "lint-staged && npm run test"
  }

prevent publish 主幹分支時，咱們能夠把tag打上：

"scripts": {
    "precommit": "npm run tag"
  }

具體怎麼自動化打 tag標籤，能夠參考個人另外篇文章 https://raoenhui.github.io/nodejs/git/2018/03/30/nodejs%E8%87%AA%E5%8A%A8%E7%94%9F%E6%88%90tag

參考資料

• https://raoenhui.github.io/nodejs/git/2018/08/10/preventcommit
• https://www.npmjs.com/package/husky
• https://www.npmjs.com/package/pre-commit
• https://www.jianshu.com/p/072a96633479

Happy coding .. :)