Closed10

ESLintのeslintrcをFlat Configに移行したい

mayobimumayobimu

before

{
    "env": {
      "node": true,
      "es6": true,
      "jest": true
    },
    "root": true,
    "parser": "@typescript-eslint/parser",
    "plugins": [
      "@typescript-eslint"
    ],
    "extends": [
      "next",
      "next/core-web-vitals",
      "eslint:recommended",
      "prettier",
      "plugin:@typescript-eslint/recommended",
      "plugin:jest/recommended"
    ],
    "parserOptions": {
      "sourceType": "module",
      "project": "./tsconfig.json",
      "ecmaFeatures": {
        "jsx": true
      }
    },
    "ignorePatterns": ["graphql/generated/*.tsx"],
    "rules": {
      "react/no-unknown-property": 0 
    }
  }

mayobimumayobimu

一旦移行完了
globalsを入れないといけなくなった
https://eslint.org/docs/latest/use/configure/migration-guide#configuring-language-options

const globals = require("globals");
const typesEslint = require('@typescript-eslint/eslint-plugin');
const typesParser = require('@typescript-eslint/parser');
const next = require('eslint-config-next');
const nextCoreWebVitals = require('eslint-config-next/core-web-vitals');
const esRecommended = require('eslint/conf/eslint-recommended');
const prettier = require('eslint-config-prettier');
const tsRecommended = require('eslint-plugin-@typescript-eslint/recommended');
const jestRecommended = require('eslint-plugin-jest/recommended');

module.exports = [
  next,
  nextCoreWebVitals,
  esRecommended,
  prettier,
  tsRecommended,
  jestRecommended,
  {
    plugins: { typesEslint: typesEslint },
    rules: {
      'react/no-unknown-property': 0,
    },
    languageOptions: {
      parser: typesParser,
      globals: {
        ...globals.node,
        ...globals.es6,
        ...globals.jest,
      },
    },
    parserOptions: {
      sourceType: 'module',
      project: './tsconfig.json',
      ecmaFeatures: {
        jsx: true,
      },
    },
    ignores: ['graphql/generated/*.tsx'],
  },
];

mayobimumayobimu

eslint実行したらエラー

Oops! Something went wrong! :(

ESLint: 8.57.0

Error: Failed to patch ESLint because the calling module was not recognized.
If you are using a newer ESLint version that may be unsupported, please create a GitHub issue:
https://github.com/microsoft/rushstack/issues
    at Object.<anonymous> (/XXX/node_modules/@rushstack/eslint-patch/lib/modern-module-resolution.js:141:19)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
    at Module.require (node:internal/modules/cjs/loader:1143:19)
    at require (node:internal/modules/cjs/helpers:119:18)
    at Object.<anonymous> (/XXX/node_modules/@rushstack/eslint-patch/modern-module-resolution.js:1:1)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
mayobimumayobimu

rushstack入れてないのでyarn.lockを確認

ここぽい

eslint-config-next@^13.4.19:
  version "13.4.19"
  resolved "https://registry.yarnpkg.com/eslint-config-next/-/eslint-config-next-13.4.19.tgz#f46be9d4bd9e52755f846338456132217081d7f8"
  integrity 
  dependencies:
    "@next/eslint-plugin-next" "13.4.19"
    "@rushstack/eslint-patch" "^1.1.3"
    "@typescript-eslint/parser" "^5.4.2 || ^6.0.0"
    eslint-import-resolver-node "^0.3.6"
    eslint-import-resolver-typescript "^3.5.2"
    eslint-plugin-import "^2.26.0"
    eslint-plugin-jsx-a11y "^6.5.1"
    eslint-plugin-react "^7.31.7"
    eslint-plugin-react-hooks "^4.5.0 || 5.0.0-canary-7118f5dd7-20230705"
mayobimumayobimu

node_modules消して再度yarn installしてみたけど同じエラー

このスクラップは5ヶ月前にクローズされました