Husky v5以降(.huskyフォルダ)
補足
- Huskyはv4まではpackage.jsonにフックスクリプトを設定して、.git/hooks以下にスクリプトを置くことでgit commit時に発動していたが、
- v5以降は.huskyフォルダ内にフックスクリプトを設定して、GitのhookPath機能を使ってgit commit時に発動するようになった
インストール
npm install --save-dev husky
設定
npm set-script prepare "husky install" # (1)
npm run prepare # (2)
npx husky add .husky/pre-commit "npm test" # (3)
git commit # (4)
----------------------------------------
npx husky-init # (注1)
- (1) このコマンドによってpackage.jsonに以下のように"scripts"に"prepare"が登録される
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"prepare": "husky install"
},
- (2) このコマンドによって、.huskyフォルダが作成され、.gitフォルダ内のconfigに以下のようにhooksPath = .huskyが登録される
[core]
repositoryformatversion = 0
filemode = false
bare = false
logallrefupdates = true
ignorecase = true
hooksPath = .husky
- (3) このコマンドによって.husky/pre-commitファイルが作成される。pre-commitファイルはシェルスクリプトになっていて、中で"npm test"登録されている
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
npm test
- (4) 上までの一連の設定でgit commit時にコミット前に"npm test"が実行される
- (注1) 上の(1)(2)(3)の代わりにこのコマンドを使ってもよい
pre-commitファイルの管理
git add .husky/pre-commit
lint-stagedと連携
インストール
npm install --save-dev lint-staged
package.json設定
vi package.json
------
"scripts": { # (1)
"test": "echo \"Error: no test specified\" && exit 1",
"pre-commit": "lint-staged",
"prepare": "husky install"
},
...,
"lint-staged": { # (2)
"*.{js,ts}": [
"eslint --fix",
"prettier --write"
]
}
------
- (1) NPMスクリプト("scripts")に"prepare"を追加して、"lint-staged"を実行するようにする
- (2) "lint-staged"にlint-stagedで実行するコマンドなどを登録する
Huskyのpre-commit設定
npx husky add .husky/pre-commit "npm run pre-commit"
- Huskyのpre-commitファイルに上で作ったNPMスクリプトを実行する"npm run pre-commit"を登録する
- 直接.husky/pre-commitファイルを編集してもよい
動作確認
git add foo.js
git commit
- git commit時にHuskyがフックされて起動し、
- .husky/pre-commitに記述された"npm run pre-commit"が実行され、
- pre-commitスクリプトの中で指定しているlint-stagedが実行され、
- lint-stagedで指定したコマンド(eslintとprettier)が実行される
参考