プリコミットフックの設定

セットアップ内容

• Husky プリコミットフック
• lint-staged による全ステージファイルへの Prettier 実行
• Prettier 設定（存在しない場合）
• プリコミットフック内での typecheck と test スクリプト

ステップ

1. パッケージマネージャーの検出

package-lock.json（npm）、pnpm-lock.yaml（pnpm）、yarn.lock（yarn）、bun.lockb（bun）を確認します。存在するものを使用してください。不明な場合は npm をデフォルトとします。

2. 依存関係のインストール

devDependencies としてインストール：

husky lint-staged prettier

3. Husky の初期化

npx husky init

これにより .husky/ ディレクトリが作成され、package.json に prepare: "husky" が追加されます。

4. .husky/pre-commit を作成

このファイルを記述します（Husky v9+ ではシバンは不要）：

npx lint-staged
npm run typecheck
npm run test

調整: npm を検出されたパッケージマネージャーに置き換えてください。リポジトリの package.json に typecheck または test スクリプトがない場合、その行を省略し、ユーザーに通知してください。

5. .lintstagedrc を作成

{
  "*": "prettier --ignore-unknown --write"
}

6. .prettierrc を作成（存在しない場合のみ）

Prettier の設定が存在しない場合のみ作成します。これらのデフォルトを使用：

{
  "useTabs": false,
  "tabWidth": 2,
  "printWidth": 80,
  "singleQuote": false,
  "trailingComma": "es5",
  "semi": true,
  "arrowParens": "always"
}

7. 検証

• .husky/pre-commit が存在し、実行可能である
• .lintstagedrc が存在する
• package.json の prepare スクリプトが "husky" である
• prettier 設定が存在する
• npx lint-staged を実行して動作確認する

8. コミット

変更・作成されたファイルをすべてステージし、Add pre-commit hooks (husky + lint-staged + prettier) というメッセージでコミットします。

これにより新しいプリコミットフックが実行され、すべてが正常に動作していることを確認できます。

注記

• Husky v9+ ではフックファイルにシバンが不要です
• prettier --ignore-unknown は Prettier が解析できないファイル（画像など）をスキップします
• プリコミットは lint-staged を最初に実行し（高速、ステージされたファイルのみ）、その後フルな型チェックとテストを実行します