【ESLint】.eslintrc から v10 の flat config へ移行したログ — 実際に壊れた4箇所

# 1. 旧設定を flat config に変換する
npx @eslint/migrate-config .eslintrc.json
# 実行結果
# Migrating .eslintrc.json
# Wrote new config to ./eslint.config.mjs

# 2. 移行ツールが要求する依存を入れる
npm install -D globals @eslint/js @eslint/eslintrc

# 3. 変換後の設定で実行する
npx eslint src/app.js
# 実行結果
#   1:1  error    /* eslint-env */ comments are no longer supported
#   3:7  warning  'unusedThing' is assigned a value but never used
# 2 problems (1 error, 1 warning)

{
  "root": true,
  "env": { "browser": true, "node": true, "es2022": true },
  "parserOptions": { "ecmaVersion": 2022, "sourceType": "module" },
  "extends": ["eslint:recommended"],
  "rules": { "no-unused-vars": "warn" }
}

/* eslint-env node */
import { readFileSync } from "node:fs";

const unusedThing = 42;

export function loadConfig(path) {
  if (path == null) {
    return {};
  }

  return JSON.parse(readFileSync(path, "utf8"));
}

ESLINT_USE_FLAT_CONFIG=false npx eslint src/app.js
# 実行結果（抜粋）
# src/app.js
#   4:7  warning  'unusedThing' is assigned a value but never used  no-unused-vars
# 1 problem (0 errors, 1 warning)
# ESLintRCWarning: You are using an eslintrc configuration file, which is deprecated
#   and support will be removed in v10.0.0.

npm install eslint@10
ESLINT_USE_FLAT_CONFIG=false npx eslint src/app.js
# 実行結果
# ESLint: 10.12.0
# ESLint couldn't find an eslint.config.* file.
# (exit code 2)

npx eslint --no-eslintrc src/app.js
# 実行結果
# Invalid option '--eslintrc' - perhaps you meant '--ext'?

npx eslint --env node src/app.js
# 実行結果
# Invalid option '--env' - perhaps you meant '--ext'?

npx eslint src/app.js
# 実行結果
# src/app.js
#   1:1  error    /* eslint-env */ comments are no longer supported
#   4:7  warning  'unusedThing' is assigned a value but never used   no-unused-vars
# 2 problems (1 error, 1 warning)

import globals from "globals";

export default [
  {
    languageOptions: {
      globals: { ...globals.node },
    },
  },
];

# v10: ネストした設定が適用される
npx eslint packages/api/index.js
# 実行結果
# packages/api/index.js
#   2:3  error  Unexpected console statement  no-console
# 1 problem (1 error, 0 warnings)

npx eslint --print-config packages/api/index.js
# 実行結果（抜粋）
# no-console: [2, {}] / rules数: 1

# v9.39.5: 同じコマンドでもネストした設定は使われない
npx --yes eslint@9.39.5 packages/api/index.js
# 実行結果（出力なし = ルートの設定だけが読まれた）

// 移行ツールの生成物（抜粋）
import js from "@eslint/js";
import { FlatCompat } from "@eslint/eslintrc";

const compat = new FlatCompat({
    baseDirectory: __dirname,
    recommendedConfig: js.configs.recommended,
});

export default defineConfig([{
    extends: compat.extends("eslint:recommended"),
    languageOptions: {
        globals: { ...globals.browser, ...globals.node },
        ecmaVersion: 2022,
        sourceType: "module",
    },
}]);

import js from "@eslint/js";
import globals from "globals";

export default [
  js.configs.recommended,
  {
    files: ["**/*.js", "**/*.jsx"],
    languageOptions: {
      ecmaVersion: 2022,
      sourceType: "module",
      parserOptions: { ecmaFeatures: { jsx: true } },
      globals: { ...globals.node },
    },
    rules: {
      "no-unused-vars": "warn",
    },
  },
];

npx eslint src/app.js
# 実行結果
# src/app.js
#   3:7  warning  'unusedThing' is assigned a value but never used  no-unused-vars
# 1 problem (0 errors, 1 warning)

npx eslint src/card.jsx
# 実行結果（v10）
# （出力なし = 未使用の指摘なし）

npx --yes eslint@9.39.5 src/card.jsx
# 実行結果（v9.39.5）
# src/card.jsx
#   1:7  warning  'Card' is assigned a value but never used  no-unused-vars