pre-commit時にhuskyでfrontendのtest,、eslint、robocop、rspecを実行する | Mac + Docker + Rails + Next.js その0043

参考にさせていただいたページ

• Husky - Git hooks

はじめに

今回の手順はfrontendディレクトリではなく、リポジトリのrootディレクトリで行っていきます。

インストール

huskyをインストールします。

% yarn add -D husky

Enable Git hooks

Git hooksを有効化します。

% npx husky install

以下のように表示されました。

husky - Git hooks installed

package.jsonにscripts.prepareを追記

以下のようになりました。

{
  "scripts": {
    "prepare": "husky install"
  },
  "devDependencies": {
    "husky": "^8.0.1"
  }
}

Create a hook

.husky/pre-commitファイルを作成します。

% npx husky add .husky/pre-commit "yarn --cwd frontend lint"

このとき生成されるファイルは以下の記述内容です。

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

yarn --cwd frontend lint

.husky/pre-commitの編集

一行追記して、以下の通りに編集しました。

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

echo 'frontend lint を実行します。'
yarn --cwd frontend lint

echo 'frontend test:ci を実行します。'
yarn --cwd frontend test:ci

echo 'rubocop を実行します。'
docker-compose run -T --rm app rubocop

echo 'rspec を実行します。'
docker-compose run -T --rm app rspec

git commitして動くか確認してみる

普通にaddして、commitしたら動きました。

git pushのときに実行するには

今回の手順で作成した.husky/pre-commitのファイル名を.husky/pre-pushに変更するだけでOKです。

commitする度に実行するのは時間がかかり過ぎるなと思ったらpre-pushで実行するのも良いと思います。