Closed5
Huskyを使用してgit push前にコードの品質を担保する
Huskyとは?
- Gitのフックを使用してスクリプトを実行できる、Node.js 製のツール
- package.json で設定可能
- commit, push前にテストしたりビルドしたりできる
- Lintでコードの品質担保とか
公式のGet Startedを見ながら実際にhuskyを触ってみる
準備
// install
% npm install --save-dev husky
// init
% npx husky init
.huskyディレクトリが作成された

あとは生成されたpre-commitにスクリプトを書いていくと、コミット時に実行できる感じ
設定自体はめっちゃ簡単
とりあえず触ってみる
一旦echo
適当にechoとかを入れてみて検証してみる
.husky/pre-commit
echo "Hello World"
コミットのタイミングでpre-commitに書いたスクリプトが実行されているのがわかる
% git commit -m "test commit"
Hello World
1 file changed, 2 insertions(+)
buildしてみる
今回はNext.jsのプロジェクトに導入しようと思うので、実際の状況を想定して、ビルドをさせてみることにする(本来はpushのタイミングで行いたいが、先に一旦テストとしてcommitのタイミングで確認)
以下を追加↓
.husky/pre-commit
npm run build
if [ $? -ne 0 ]; then
echo "Error: Build failed."
exit 1
fi
ちゃんとビルドされて、その後にコミットされているのがわかる↓
% git commit -m "test commit"
> test-project@0.1.0 build
> next build
▲ Next.js 15.3.2
Creating an optimized production build ...
✓ Compiled successfully in 0ms
✓ Linting and checking validity of types
✓ Collecting page data
✓ Generating static pages (4/4)
✓ Collecting build traces
✓ Finalizing page optimization
Route (app) Size First Load JS
┌ ○ / 136 B 101 kB
└ ○ /_not-found 977 B 102 kB
+ First Load JS shared by all 101 kB
├ chunks/4bd1b696-67ee12fb04071d3b.js 53.2 kB
├ chunks/684-819c3ec28c575323.js 45.9 kB
└ other shared chunks (total) 1.89 kB
○ (Static) prerendered as static content
1 file changed, 6 insertions(+), 1 deletion(-)
落ちる場合だと以下の感じ↓
% git commit -m "test failed commit"
> test-project@0.1.0 build
> next build
▲ Next.js 15.3.2
Creating an optimized production build ...
Failed to compile.
./app/page.tsx
Error: x Parenthesized expression cannot be empty
,-[/test-project/app/page.tsx:2:1]
1 | export default function Home() {
2 | ,-> return (
3 | `-> );
4 | }
`----
Caused by:
Syntax Error
Import trace for requested module:
./app/page.tsx
> Build failed because of webpack errors
husky - pre-commit script failed (code 1)
実際に導入してみる
今回はpushする前にビルドをしたいので、commit時のフック(pre-commit)ではなくpush時のフックを使用したい。(毎回commitのタイミングでビルドをしていると結構時間かかって効率が悪いので)
pre-pushファイルを準備して先ほどのpre-commitで書いたコードをそのまま利用する
.husky/pre-commit
npm run build
if [ $? -ne 0 ]; then
echo "Error: Build failed."
exit 1
fi
ちゃんとpushのタイミングでビルドできていたので問題なさそう↓
% git push origin install-husky
Running npm build before push...
> test-project@0.1.0 build
> next build
▲ Next.js 15.3.2
Creating an optimized production build ...
✓ Compiled successfully in 0ms
✓ Linting and checking validity of types
✓ Collecting page data
✓ Generating static pages (4/4)
✓ Collecting build traces
✓ Finalizing page optimization
Route (app) Size First Load JS
┌ ○ / 136 B 101 kB
└ ○ /_not-found 977 B 102 kB
+ First Load JS shared by all 101 kB
├ chunks/4bd1b696-67ee12fb04071d3b.js 53.2 kB
├ chunks/684-819c3ec28c575323.js 45.9 kB
└ other shared chunks (total) 1.89 kB
○ (Static) prerendered as static content
Build successful. Continuing with push...
Enumerating objects: 13, done.
Counting objects: 100% (13/13), done.
Delta compression using up to 10 threads
Compressing objects: 100% (7/7), done.
Writing objects: 100% (10/10), 1.25 KiB | 1.25 MiB/s, done.
Total 10 (delta 4), reused 0 (delta 0), pack-reused 0
remote: Resolving deltas: 100% (4/4), completed with 3 local objects.
remote:
remote: Create a pull request for 'install-husky' on GitHub by visiting:
remote: *****
remote:
To ******
* [new branch] install-husky -> install-husky
他にはどのようなフックがあるか?
HuskyはクライアントサイドのGitが対応しているフック13種類全部が使える
- Supports:
- macOS, Linux, Windows
- Git GUIs, Node version managers, custom hooks directory, nested projects, monorepos
- All 13 client-side Git hooks
まとめてもらうと以下の感じ
| フック名 | 発火タイミング / 代表的な使い道 |
|---|---|
| applypatch-msg |
git am でパッチ適用前、コミットメッセージを検査・整形 |
| pre-applypatch | パッチ適用後・コミット前にテスト実行など |
| post-applypatch | パッチ+コミット完了後に通知やログ出力 |
| pre-commit | コミット直前。ESLint・Prettier・ユニットテストなど最頻出 |
| prepare-commit-msg | 生成されたデフォルトメッセージを編集(テンプレ自動挿入など) |
| commit-msg | 最終メッセージ検証(Conventional Commits / commitlint など) |
| post-commit | コミット完了後。Slack 通知やバージョンファイル更新など |
| pre-rebase | リベース開始前。保護ブランチのリベース禁止など |
| post-checkout | ブランチ切替・ファイル checkout 後。依存インストールのトリガーに |
| post-merge |
git pull/マージ成功後。ファイル生成・キャッシュ再構築など |
| pre-push | リモートへ送る直前。テスト・型チェックが失敗すると push を中断 |
| pre-auto-gc | Git が自動 GC を走らせる前。容量監視やバックアップに |
| post-rewrite |
commit --amend や rebase で履歴を書き換えた後の後処理 |
詳しくはこちらのGitのドキュメントを参考にする
このスクラップは2025/05/29にクローズされました