基本的な使い方 husky v8 コミット時に自動ビルド or 自動テスト 失敗時にコミットは実行されない。 成功時は通常通り。

導入の経緯

Next.jsで、npm run devとnpm run buildを実行したところ、前者は正常に動作し、動作確認が取れたと思い込んでいましたが、後者は失敗していたことがありました。そのため、npm run buildの自動実行をしてくれる husky を取り入れることにしました。

前提知識

git の一通りの知識。

husky v8 の特徴

最近のバージョンでは、自動インストールが可能になりました。コマンドを一つ実行するだけで、自動的にインストールと設定が行われます。ただし、モノレポなどの複雑な環境はわかりません。

huskyについて

huskyはある特定のタイミングで指定したコマンドをバックグラウンドで実行させます。
npm scriptを複数自動実行してくれます。

例
ビルド
テスト
リント
設定すれば、複数コマンドをバックグラウンドで自動実行されます。

※ npm run dev を実行している時にコミットをすると、↑これらのコマンドは自動実行はされますが、ビルドコマンドはpermission エラーとなって失敗します。

公式サイト

現在のバージョン
"husky": "^8.0.0"

husky インストール

自動インストール（推奨）

npx husky-init && npm install

このコマンドだけでよしなにしてくれます、インストールされる中の詳細は公式サイトを御覧ください。

手動編集でコマンドを追加する方法

↓ファイルを開いて編集します。

.husky\pre-commit

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npm run build   #＜＜＜ここに実行したいnpm scriptを書きます。

これでコミット時に「バックグラウンド」で npm run build が走り
buildコマンドが失敗するとコミットがされません。＜＜便利
buildコマンドが成功するとコミットは通常通りです。

※ビルドだけを実行したい場合はここで終了です。

コミット時にビルドを必要としない場合

.husky\pre-commit

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

# npm run build   #コメントアウトすると実行されません。

↑不要なコマンドの先頭にコメントアウトしておけば実行されません。

導入したいコマンドを、CLI から husky に追加したい場合

npm testを追加したい場合、ターミナルから

npx husky add .husky/pre-commit "npm test"

↓コマンドの実行結果

.husky\pre-commit

#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"

npm run build
npm test

これでコミット時に ビルドとテストが自動実行されます。

他にも、npm run lint などを追加したい場合など、各自工夫をしてみてください。