Error: Failed to load config "next" to extend from

Question

I have a Nextjs app using jest and react-testing-library for the test, I add the .eslintrc file with npx .eslintrc --init command to my project. whenever I lint my project, I get the following error:

.eslintrc.js:

module.exports = {
"extends": [
    "eslint:recommended",
    "plugin:react/recommended",
    "plugin:@typescript-eslint/recommended",
    "plugin:@typescript-eslint/recommended-requiring-type-checking",
    "next",
    "next/core-web-vitals"
],
"parser": "@typescript-eslint/parser",
"parserOptions": {
    "project":"./tsconfig.json",
    "ecmaFeatures": {
        "jsx": true
    },
    "ecmaVersion": 12,
    "sourceType": "module"
},
"rules": {
}

};

and error:

info  - Using webpack 5. Reason: Enabled by default https://nextjs.org/docs/messages/webpack5
Error: Failed to load config "next" to extend from.
Referenced from: D:\web\reactjs\react-testing\react-testing-app\.eslintrc.js

Answer 1

Resolved, after installing this package, the code will run without error:

npm i --save-dev eslint-config-next

Answer 2

For a misterious reason running npm audit fix --force changed my package.json from:

"eslint-config-next": "12.0.1"

to:

"eslint-config-next": "^0.2.4"

I had to change it manually and the error went away.