reactjseslintcreate-react-app

Create-react-app - ERROR in Plugin "react" was conflicted between ".eslintrc.json" and "BaseConfig"


After updating to CRA 5.0.0, I got this error on compilation process:

ERROR in Plugin "react" was conflicted between ".eslintrc.json" and "BaseConfig » "..\react-app\node_modules\eslint-config-react-app\base.js".

My eslint configuration is:

{
    "env": {
        "browser": true,
        "es2021": true
    },
    "extends": [
        "plugin:react/recommended",
        "airbnb",
        "plugin:react/jsx-runtime"
    ],
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
        "ecmaFeatures": {
            "jsx": true
        },
        "ecmaVersion": 12,
        "sourceType": "module"
    },
    "plugins": [
        "react",
        "@typescript-eslint"
    ],
    "rules": {...}
}

Any solutions/fixes?


Solution

  • The problem:

    eslint-plugin-react version in your project's dependency is "different" from the one in eslint-config-react-app package's dependency, hence "conflicting".

    The solution:

    Avoid deleting the .lock file as many suggested here (it's there for a reason). Instead, dedupe its entries and then re-install.

    npm:

    npm dedupe && npm i
    

    yarn v1:

    npx yarn-deduplicate && yarn
    

    yarn v3+:

    yarn dedupe
    

    pnpm:

    pnpm dlx pnpm-deduplicate && pnpm i
    

    pnpm v8.3.0+:

    pnpm dedupe && pnpm i