開発効率を上げる為にcommit時に自動でprettierとlintを走らせる

#huskyとは？
Git hooksを簡単にできるツールです。
commit、push時にscriptを走らせることができます。
Github: https://github.com/typicode/husky

##lint-stagetとは？
ステージング済みのファイルに対して、特定の処理が走らせることができるツールです。
Github： https://github.com/okonet/lint-staged

#実装

まず、開発プロジェクトを用意しましょう。
今回はReactで行います。

npx create-react-app プロジェクト名

プロジェクトを立ち上げた後、最低限必要なpackageをインストールします。
（他のlintなど必要な場合プロジェクトによって変更してください。今回はprettierとeslintの設定に関しては触れません。）

・ Eslint
・ prettier
・ husky
・ lint-staged

npm i -D eslint prettier husky lint-staged

必要な設定を行っていきます。

"lint-staged": {
    "*.{js,jsx,ts,tsx}": [
      "eslint --fix \"src/**/*.{ts,tsx}\"",
      "prettier --write \"src/**/*.{ts,tsx,css}\""
    ]
  },

※設定内容に関しては、プロジェクトごとに対応した変更をしてください。

Git hooksを有効化していきます。

npx husky install

.huskyディレクトリが作成されます。

Githubのリポジトリからcloneする際にGithooksを有効化する為に以下のスクリプトを作成します。

"scripts": {
  "prepare": "husky install"
  "lint-staged":"lint-staged"
}

コミットした時に実行されるhooksを用意します。

npx husky add .husky/pre-commit "npm run lint-staged"

実行後に.huskyフォルダ内に.husky/pre-commitファイルが生成されます。（このファイルに記述している内容が走ります。必要があれば他のscriptも追加してください。）

あとは、commitした時に実行されていれば完了です。