CreateReactAppのESLintの設定を知りたい

最近、Reactの勉強の環境をCRAからViteに変更しました
それまで、ESLintの設定はCRAのデフォルトのものでまったく触ってもいませんでした

VSCode上にとてつもない数のエラーが出て、しかも自動修正もされません。
そもそもこの機能自体が、VSCodeの拡張機能のものだと思っていたほど知識がないので、
一から自分で設定できるとは思えません

なので、せめてCRAで使われているルールだけでもViteに導入したいです

ですが、「CRAのESLintの設定」で検索したり、findコマンドでeslintrcファイルを探したりしましたが、
使えそうな情報は見つけられませんでした

どなたか、ご教授いただきたけるとありがたいです。

行動規範の内容に同意します

回答1件

ベストアンサー

CRAのESLintの設定はpackage.json内のeslintConfigで定義されています。

  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },

直接の依存関係にあるreact-scriptsの依存関係にあるeslint-plugin-reactが実際の設定を担っているのでそこを参照します。要は以下のファイルです。
https://github.com/facebook/create-react-app/blob/v4.0.3/packages/eslint-config-react-app/index.js

※直接の設定ファイル（eslintrcやeslint.json）ではないので違う点もあるかもしれません

ルールを抜き出してもいいですが、https://github.com/facebook/create-react-app/tree/v4.0.3/packages/eslint-config-react-app を参照してLinterパッケージをインストールした方が楽だと思います。

投稿2022/06/21 10:18