nexjsでnext lintを行うとエラーとなる事象は、バージョンの整合をとると解決できた

筆者環境

• windows11 Pro
• 12th Gen Intel(R) Core(TM) i5-12400F
• NVIDIA GeForce RTX 3060
• WSL2
• "next": "15.3.4",
• "eslint": "^8.0.0",

事象について

自分の愛猫を紹介するホームページをあらかた形にして稼働している状態までもっていったため、めんどくさいと思って放置していたlinter周りに手を出そうとしたとき、yarn lint(next lint)を行うと下記エラーが出て実行できない事象に陥りました。

プロジェクト立ち上げ時はnpx nextコマンドで立ち上げましたが、gemini cliを使いまくり開発を行っていたので、linterの設定などがどのように設定されているか自分でも追えない状況になっていました。

napa@napa:~/tool/git/uru-site$ yarn lint
yarn run v1.22.22
$ next lint
Invalid Options:
- Unknown options: useEslintrc, extensions, resolvePluginsRelativeTo, rulePaths, ignorePath, reportUnusedDisableDirectives
- 'extensions' has been removed.
- 'resolvePluginsRelativeTo' has been removed.
- 'ignorePath' has been removed.
- 'rulePaths' has been removed. Please define your rules using plugins.
- 'reportUnusedDisableDirectives' has been removed. Please use the 'overrideConfig.linterOptions.reportUnusedDisableDirectives' option instead.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
napa@napa:~/tool/git/uru-site$ 

事象発生時の各設定ファイル

package.json

{
  "name": "uru-site",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint",
    "export": "next build && next export"
  },
  "dependencies": {
    "@radix-ui/react-slot": "^1.2.3",
    "class-variance-authority": "^0.7.1",
    "clsx": "^2.1.1",
    "firebase": "^11.10.0",
    "firebase-admin": "^13.4.0",
    "lucide-react": "^0.525.0",
    "next": "15.3.4",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "tailwind-merge": "^3.3.1"
  },
  "devDependencies": {
    "@types/node": "^20.0.0",
    "@types/react": "^18.2.0",
    "@types/react-dom": "^18.2.0",
    "@typescript-eslint/eslint-plugin": "^8.36.0",
    "@typescript-eslint/parser": "^8.36.0",
    "autoprefixer": "^10.4.14",
    "eslint": "^8.0.0",
    "eslint-config-next": "15.3.4",
    "eslint-config-prettier": "^10.1.5",
    "eslint-plugin-tailwindcss": "^3.18.0",
    "postcss": "^8.4.24",
    "tailwindcss": "^3.3.0",
    "typescript": "^5.0.0"
  }
}

eslint.config.mjs

import { dirname } from "path";
import { fileURLToPath } from "url";
import { FlatCompat } from "@eslint/eslintrc";

const __filename = fileURLToPath(import.meta.url);
const __dirname = dirname(__filename);

const compat = new FlatCompat({
  baseDirectory: __dirname,
});

const eslintConfig = [
  ...compat.extends("next/core-web-vitals", "next/typescript"),
];

export default eslintConfig;

原因究明に向けて行ったこと

nextjsのプロジェクトを作成したときに、初期設定はどうなっていたかを確認するために、npxでnextjsプロジェクトを新規に立ち上げました(別プロジェクトとして)

npx create-next-app@latest

nextjs公式Docs インストール方法

すると、package.jsonにバージョンの違いが発見されました。

package.json

{
  "name": "test",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev --turbopack",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "next": "15.3.5"
  },
  "devDependencies": {
    "typescript": "^5",
    "@types/node": "^20",
    "@types/react": "^19",
    "@types/react-dom": "^19",
    "@tailwindcss/postcss": "^4",
    "tailwindcss": "^4",
    "eslint": "^9",
    "eslint-config-next": "15.3.5",
    "@eslint/eslintrc": "^3"
  }
}

eslintのバージョンに違いがありますね
ほかにも多少バージョンが異なるものもありますが、特にeslintについてはメジャーバージョンが異なりますので、こちらをにらみました。

解消策

"eslint": "^9", と指定することで、解消されました。

ほかの方のサイトを見ていると、どうやらnextjs15からはeslint v9対応となったようですね。
それで、私のプロジェクトではnextjsできちんとeslint v9の設定記法となっていたのですが、よくわからないまま設定をしているうちにeslintのバージョンの依存関係のみが8設定になっちゃったため、エラーとなっていたようですね。

［2025年 Next.js v15］ESLint(v9 Flat Config) + Prettierによる開発環境の構築

ちなみに、nextjs v15からeslint v9対応となったソースは下記のvercelのブログから判断しました
nextjs.org nextjs v15

皆さんの開発の助けになればと思います。