如何在git commit時添加eslint校驗

git Hooks

首先須要瞭解下 Git 鉤子

和其它版本控制系統同樣，Git 能在特定的重要動做發生時觸發自定義腳本。 有兩組這樣的鉤子：客戶端的和服務器端的。 客戶端鉤子由諸如提交和合並這樣的操做所調用，而服務器端鉤子做用於諸如接收被推送的提交這樣的聯網操做。

安裝一個客戶端鉤子
鉤子都被存儲在 Git 目錄下的 hooks 子目錄中。 也即絕大部分項目中的 .git/hooks 。

pre-commit

pre-commit 鉤子在鍵入提交信息前運行。 它用於檢查即將提交的快照，例如，檢查是否有所遺漏，確保測試運行，以及覈查代碼。 若是該鉤子以非零值退出，Git 將放棄這次提交，不過你能夠用 git commit --no-verify (-n) 來繞過這個環節。 你能夠利用該鉤子，來檢查代碼風格是否一致（運行相似 lint 的程序）、尾隨空白字符是否存在（自帶的鉤子就是這麼作的），或新方法的文檔是否適當。

測試 pre-commit

pre-commit.sample 裏有個文件名的檢查

➜  mkdir testHook
➜  cd testHook
➜  git init
Initialized empty Git repository in /Users/guangliang.chen/testHook/.git/
➜  cp .git/hooks/pre-commit.sample .git/hooks/pre-commit
➜  vi 測試.js // 新建中文名文件
➜  git add 測試.js
➜  git commit -m "test hook"

Error: Attempt to add a non-ASCII file name.

This can cause problems if you want to work with people on other platforms.

To be portable it is advisable to rename the file.

If you know what you are doing you can disable this check using:

  git config hooks.allownonascii true

因此咱們能夠在 pre-commit 裏添加 eslint 操做, 想經過修改 pre-commit 實現的參考這篇

不過./hooks/pre-commit 提交代碼時不會同步提交，須要下載源碼後移動到.hook 文件夾下，建議使用 pre-commit 庫

pre-commit && lint-staged

下面介紹下 pre-commit 和 lint-staged (官方建議跟 husky 一塊兒使用，不過 pre-commit 好像用的人滿多)

npm install pre-commit --save-dev
  npm install lint-staged --save-dev

package.json

"scripts": {
    "lint:staged": "lint-staged"
  },
  "lint-staged": {
    "linters": {
      "*.js": [
        "eslint --ignore-path .gitignore --fix"
      ]
    },
    "ignore": []
  },
  "pre-commit": "lint:staged",

注：

1. git hook 有不少，commit-msg post-commit 等等
2. 項目有 eslint 配置
3. 例子中只校驗 js 文件，有需求能夠添加其餘文件類型（給 lint-staged 點贊）
4. --ignore-path .gitignore（建議使用，特殊需求使用.eslintignore）