husky + lint-staged を動かしたメモ@2021年7月

久しぶりにやったら昔ながらの下記のようなものを package.json に加えるだけではうごかなったのでメモ

  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "src/**/*.{js,jsx,ts,tsx}": [
      "eslint --fix"
    ]
  }

まずは必要なパッケージをインストールします。

npm i -D husky lint-staged

husky の初期化コマンドを実行します。

npx husky-init && npm install

.husky/pre-commit というファイルができていると思うので、lint-staged を実行するように変更します。

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

npm run lint-staged

package.json に lint-staged のスクリプトと設定を追加します。

"scripts": {
    ...,
    "lint-staged": "lint-staged"
  },
  "lint-staged": {
    "*.{js,ts,jsx,tsx}": [
      "npx eslint . --fix",
      "npx prettier --write ."
    ]
  },
}

これで変なコード埋め込んでエラーが出るようになったら成功です👍

参考

https://typicode.github.io/husky/#/