⚠️
[2024年]Next.js(v15) + ESLint(v9 FlatConfig )周りの設定
昨年2023年バージョンのNext.jsのESLintの記事を書いたのですが、
色々更新されているため新しく記事を書きました。
現在Next.js(v15.0.1)をインストールするとeslintはまだ8系ですが、
これを9系にバージョンアップしたものになります。
今回は記事で詳細は解説せずPRを作成して、そこにコメントを書きました。
過去ほど丁寧には書いてませんが、参考になれば。
2024年12月12日追記
-
React19のstable版が出たので、更新しました - それに対応した
nextのバージョンに更新しました
package.json
"dependencies": {
"next": "15.1.0",
"react": "19.0.0",
"react-dom": "19.0.0"
},
何はともあれ、まずはESLintの公式ドキュメントを読むことをお勧めします。
今回作ったリポジトリ
参考PR(ここに詳細を解説してます)
参考にさせていただいたページ（感謝）
【過去記事】 2023年バージョンのリポジトリと記事
【補足】 ESLintの設定を確認出来る「ESLint Config Inspector」
ESLintの設定の内容を確認出来る
「ESLint Config Inspector」がとても便利でした。
npx eslint --inspect-configでhttp://localhost:7777/
を見る事で確認出来ます。
プロジェクトの設定が可視化出来て、おすすめです！
npm run buildで１つだけ出るwarningが解決出来ない。。
npm run buildで１つだけ出るwarningが解決出来ない。。2024年12月12日 追記
↓↓↓↓↓コメント頂いて、解決しました。
以下のファイルをignoresに含めてしまっていたためのwarningのようでした。
'**/eslint.config.mjs'
configファイル系をlintに含めてしまっても特に問題なさそうなので、
ignoresから削除しました。
eslint.config.mjs
{
ignores: [
- '**/eslint.config.mjs',
- '**/prettier.config.js',
- '**/next.config.mjs',
- '**/tailwind.config.js',
- '**/tsconfig.json',
- '**/postcss.config.mjs',
機能的には問題ないのですが、
１つずつ自力でセットアップしているからしょうがないのか。
Next.jsのバージョンアップすれば解決するのか。
ご存知の方いたら教えてください🙇
⚠ The Next.js plugin was not detected in your ESLint configuration.
See https://nextjs.org/docs/basic-features/eslint#migrating-existing-config
Discussion
ignoresに'**/eslint.config.mjs'を入れているからだと思います。自分の環境だと、
'**/eslint.config.mjs'を外したら消えました。@YAKATA
共有ありがとうございます！
ignoresにconfigを含めていたので認識されてなかったんですね。助かりました🙇