Как мигрировать мой cra .eslintrc.js config в eslint.config.js в новом приложении Vite + React 19 ⇐ Javascript

[Anonymous]

Я пытаюсь настроить ту же конфигурацию Eslint в моем новом приложении React 19 + Vite, используя современный формат eslint.config.js . Тем не менее, это не работает-Linter не показывает никаких ошибок или предупреждений в редакторе.
new eslint.config.js < /p>

Код: Выделить всё

import pluginReact from "eslint-plugin-react";
import { defineConfig } from "eslint/config";

import reactHooks from "eslint-plugin-react-hooks";
import reactRefresh from "eslint-plugin-react-refresh";
import prettier from "eslint-plugin-prettier";
import importPlugin from "eslint-plugin-import";
import react from "eslint-plugin-react";
import jsxA11y from "eslint-plugin-jsx-a11y";

export default defineConfig([
{ ignores: ["dist"] },
{
files: ["**/*.{js,mjs,cjs,jsx}"],
languageOptions: {
ecmaVersion: 2020,
globals: globals.browser,
parserOptions: {
ecmaVersion: "latest",
ecmaFeatures: { jsx: true },
sourceType: "module",
},
},
plugins: {
"react-hooks": reactHooks,
"react-refresh": reactRefresh,
prettier,
import: importPlugin,
react,
"jsx-a11y": jsxA11y,
},
rules: {
...js.configs.recommended.rules,
...reactHooks.configs.recommended.rules,
// "no-unused-vars": ["error", { varsIgnorePattern: "^[A-Z_]"  }],
// "no-undef": ["error", { globals: { process: true } }],
// Vite React specific
"react-refresh/only-export-components": [
"warn",
{ allowConstantExport: true },
],

// Your custom rules from old config
"prettier/prettier": "off",
"no-nested-ternary": "off",
"no-underscore-dangle": "off",
"default-param-last": "off",
"prefer-arrow-callback": "error",
camelcase: ["error", { properties: "never", ignoreDestructuring: true }],
"no-else-return": ["error", { allowElseIf: true }],
"no-param-reassign": ["error", { props: false }],

// Import rules
"import/no-extraneous-dependencies": [
"error",
{
devDependencies: false,
optionalDependencies: false,
peerDependencies: false,
},
],
"import/order": [
"error",
{
pathGroups: [
{
pattern: "react",
group: "external",
position: "before",
},
],
pathGroupsExcludedImportTypes: ["builtin"],
},
],
"import/no-unused-modules": ["error", { unusedExports: true }],

// React rules
"react/require-default-props": "off",
"react/jsx-no-undef": ["error", { allowGlobals: true }],
"react/jsx-uses-vars": "error",

// Best Practices
eqeqeq: "error",
"no-invalid-this": "error",
"no-return-assign": "error",
"no-unused-expressions": ["error", { allowTernary: true }],
"no-useless-concat": "error",
"no-useless-return": "error",
"no-use-before-define": "error",
"no-duplicate-imports": "error",
"no-plusplus": ["error", { allowForLoopAfterthoughts: true }],

// Variable and import rules
"no-undef": "error",
"no-unused-vars": [
"error",
{
vars: "all",
args: "after-used",
ignoreRestSiblings: true,
varsIgnorePattern: "^[A-Z_]", // Keep the pattern from new config
},
],
},
settings: {
react: {
version: "detect",
},
},
},
pluginReact.configs.recommended,
]);

Это конфигурация Eslint, которую я успешно использовал в моем более старом приложении CRA (.ESLINTRC.JS) :
env: {
browser: true,
es2021: true,
node: true,
},
extends: ["prettier"],

plugins: ["prettier", "import", "react", "react-hooks", "jsx-a11y"],
parserOptions: {
ecmaFeatures: {
jsx: true,
},
ecmaVersion: 12,
sourceType: "module",
},
rules: {
"prettier/prettier": "off",
"no-nested-ternary": "off",
"react/require-default-props": "off",
"no-underscore-dangle": ["off"],
"default-param-last": "off",
"prefer-arrow-callback": "error",
camelcase: ["error", { properties: "never", ignoreDestructuring: true }],
"no-else-return": ["error", { allowElseIf: true }],
"no-param-reassign": ["error", { props: false }],
// Best Practices
"import/no-extraneous-dependencies": [
"error",
{
devDependencies: false,
optionalDependencies: false,
peerDependencies: false,
},
],
eqeqeq: "error",
"no-invalid-this": "error",
"no-return-assign": "error",
"no-unused-expressions": ["error", { allowTernary: true }],
"no-useless-concat": "error",
"no-useless-return": "error",
"no-use-before-define": "error",
"no-duplicate-imports": "error",
"no-plusplus": ["error", { allowForLoopAfterthoughts: true }],
"import/order": [
"error",
{
pathGroups: [
{
pattern: "react",
group: "external",
position: "before",
},
],
pathGroupsExcludedImportTypes: ["builtin"],
},
],
// Ensure components are imported if used
"react/jsx-no-undef": ["error", { allowGlobals: true }],
// Ensure all variables are declared before use
"no-undef": "error",
// Ensure there are no unused variables
"no-unused-vars": ["error", { vars: "all", args: "after-used", ignoreRestSiblings: true }],
// Ensure there are no unused imports
"import/no-unused-modules": ["error", { unusedExports: true }],
// Mark variables used in JSX as used
"react/jsx-uses-vars": "error",
},
settings: {
react: {
version: "detect",
},
},
};
< /code>
Я попробовал NPM запустить Lint < /code>, но я получаю это
oops! Что -то пошло не так! : (< /p>
eslint: 9.28.0 < /p>
Eslint не смог найти файл конфигурации. Чтобы настроить файл конфигурации для этого проекта, запустите: < /p>
`npm init @eslint/config@latest`
< /code>
И если я запускаю эту команду, она сбрасывает полный файл eslint.config.js < /p>
, но я не уверен, как правильно преобразовать или применить его в новую плоскую конфигурацию (Eslint.config.js).
Любые идеи о том, как исправить его, так что Eslint.>

Подробнее здесь: https://stackoverflow.com/questions/796 ... ew-vite-re