🐶
Husky v9 での lint-staged 設定(prettier 利用)
概要
Huskyがv9になり、使い方が微妙に変わっていた。
ChatGPTに聞くと混乱した答えが返ってくるので、公式情報を確認し、記事にまとめる。
パッケージバージョン
この記事を執筆している時点での、利用しているパッケージのバージョンは以下の通り。
"husky": "9.1.7",
"lint-staged": "16.1.0",
"prettier": "3.5.3",
Husky セットアップ
公式ドキュメントの Get Started を見ると分かりやすい。
まず、インストール。
npm install --save-dev husky lint-staged prettier
次にセットアップ。
npx husky init
ルートディレクトリに .husky
ディレクトリが生成される。中身は以下のような感じ。
.husky/pre-commit
以外は git ignore されている。
また、package-json に以下の行が追加される。
"scripts": {
"prepare": "husky" # ← 自動追加
}
以上。 husky install
や husky add
はなくなった。
lint-staged, prettier 設定
ついでに、lint-staged と prettier の設定を行う。
まず、package-json に以下のセクションを追加。
{
"lint-staged": {
"**/*.{js,ts,tsx,jsx,json,md}": "prettier --write"
}
}
次に、 .husky/pre-commit
に以下の1行を追加。
npx lint-staged
これだけでOK。git commit 時に prettier が実行されるようになった。
個人的には、以前よりシンプルに書けるようになってGood。
Discussion