.git と package.json が同一ディレクトリにいないプロジェクトで husky をつかう

Git リポジトリ配下に frontend/ とかってディレクトリがいて、その中に package.json がいるような場合、husky を動かすのにハマったのでメモ。少し工夫が必要でした。

例えば、こんな構成。
.git/ と package.json が別のディレクトリにいます。

root/
|--.git/ <- ここと
|--backend/
|  └──...
└──frontend/
   |--...
   |--package.json <- ここ
   └──...

順を追って、動くところまでもっていきましょう。

まずは、husky を追加。husky は v4 系と v5~6 系で設定方法が違うようなので注意！
今回は v5 系で動かします。

$ cd frontend
$ npm i -D husky@^5

v4 までの (?) husky は、npm install でセットアップをよしなにしようとしてくれる反面、新メンバーなどが入った際の環境構築時にうまく動かないことが多いイメージ。

続いて、以下を実行。

$ npx husky init

すると、こんなメッセージが出力されます。

husky - updated package.json
.git can't be found (see https://typicode.github.io/husky/#/?id=custom-directory)

「.git can't be found」
package.json と同じディレクトリに .git/ が存在しないためです。
ですが、ここまでは問題ないので作業を続けましょう。

package.json を開くと、以下のような script が追加されてます。

packaje.json

{
  ...
  "scripts": {
    "prepare": "husky install"
  },
  ...
}

npm install 時に husky install が実行されるようになります。
しかし、このままだと毎回エラーが出てしまうので、以下のように修正します。

packaje.json

{
  ...
  "scripts": {
    "prepare": "cd .. && husky install frontend/.husky"
  },
  ...
}

"ルートディレクトリから、必要ファイルは frontend/.husky に吐き出して" husky install を実行させます。

修正したら、改めて npm install します

$ npm i

husky install が成功し、.husky/ が生成されるので、pre-commit ファイルを作成します。

$ npx husky add .husky/pre-commit "echo \"Hello husky world :D\""

ここまでできれば、husky が動いてくれるはずなので、試しに空コミットをしてみます。

$ git co --allow-empty -m "Empty commit for installation for husky"
Hello husky world :D
[master xxxxxxx] Empty commit for installation for husky

動きました。一件落着。

おしまい。