facebook / create-react-app

Set up a modern web app by running one command.
https://create-react-app.dev
MIT License
102.77k stars 26.87k forks source link

`eslint-config-react-app` causing conflicts after updating `@typescript-eslint` to v6 #13286

Open SuperKXT opened 1 year ago

SuperKXT commented 1 year ago

Describe the bug

I updated a project to the newly released version 6 of @typescript-eslint. After the update, I'm getting eslint conflicts with eslint-plugin-imports and @typescript-eslint plugins. I think the fix is to update the dependencies in eslint-config-react-app but I am not sure.

Here is the full error

Uncaught exception received.
Error: Plugin "import" was conflicted between ".eslintrc.cjs#overrides[0] » eslint-config-react-app" and ".eslintrc.cjs".
    at mergePlugins (/home/superkxt/repos/personal/client-management/node_modules/.pnpm/@eslint+eslintrc@2.1.0/node_modules/@eslint/eslintrc/dist/eslintrc.cjs:598:19)
    at createConfig (/home/superkxt/repos/personal/client-management/node_modules/.pnpm/@eslint+eslintrc@2.1.0/node_modules/@eslint/eslintrc/dist/eslintrc.cjs:701:9)
    at ConfigArray.extractConfig (/home/superkxt/repos/personal/client-management/node_modules/.pnpm/@eslint+eslintrc@2.1.0/node_modules/@eslint/eslintrc/dist/eslintrc.cjs:877:33)
    at CLIEngine.getConfigForFile (/home/superkxt/repos/personal/client-management/node_modules/.pnpm/eslint@8.44.0/node_modules/eslint/lib/cli-engine/cli-engine.js:981:14)
    at ESLint.calculateConfigForFile (/home/superkxt/repos/personal/client-management/node_modules/.pnpm/eslint@8.44.0/node_modules/eslint/lib/eslint/eslint.js:667:26)
    at /home/superkxt/.vscode/extensions/dbaeumer.vscode-eslint-2.4.2/server/out/eslintServer.js:1:22644
    at Object.E [as withClass] (/home/superkxt/.vscode/extensions/dbaeumer.vscode-eslint-2.4.2/server/out/eslintServer.js:1:19218)
    at w.then.g.validate (/home/superkxt/.vscode/extensions/dbaeumer.vscode-eslint-2.4.2/server/out/eslintServer.js:1:22610)
    at process.processTicksAndRejections (node:internal/process/task_queues:96:5)

Did you try recovering your dependencies?

Yes

Which terms did you search for in User Guide?

None.

Expected behavior

ESLint should work

Actual behavior

ESLint errors and lining stops working

Asanio06 commented 1 year ago

I have the same issue. For the moment i resolve it by adding :

"resolutions": {
    "@typescript-eslint/eslint-plugin": "your typescript eslint version",
    "@typescript-eslint/parser": "your typescript eslint version"
  },
dominicfraser commented 1 year ago

I arrived here trying to debug the

Parsing error: DeprecationError: 'originalKeywordKind' has been deprecated since v5.0.0 and can no longer be used

warning message that comes from @typescript-eslint/* dependencies being below v6 when using TypeScript 5.2.2.

Similar to @Asanio06 I found that I had a nested dependency on eslint-config-react-app, and needed to use npm's overrides syntax to solve it (rather than yarn's resolutions).

This was pulled in via a storybook plugin in our case:

└─┬ @storybook/preset-create-react-app@7.0.21 
  └─┬ react-scripts@5.0.1
    └─┬ eslint-config-react-app@7.0.1
      ├─┬ @typescript-eslint/eslint-plugin@5.50.0
      │ └── @typescript-eslint/parser@5.62.0 
      └── @typescript-eslint/parser@5.62.0

In our project we must now use:

  "overrides": {
    "typescript": "^5.2.2",
    "@typescript-eslint/parser": "^6.7.5"
  }

(with typescript being due to react-scripts only allowing up to v4 as a peer dependency: https://github.com/facebook/create-react-app/issues/13283)

nbkhope commented 3 days ago

I upgraded the following dependencies to the latest version as of Nov 12, 2024, and get the following problem with npm install:

package.json

    "@typescript-eslint/eslint-plugin": "^8.14.0",
    "@typescript-eslint/parser": "^8.14.0",

npm install

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR!
npm ERR! While resolving: @my/project@0.5.0        
npm ERR! Found: @typescript-eslint/eslint-plugin@5.44.0
npm ERR! node_modules/@typescript-eslint/eslint-plugin
npm ERR!   @typescript-eslint/eslint-plugin@"^8.14.0" from the root project
npm ERR!   @typescript-eslint/eslint-plugin@"^5.5.0" from eslint-config-react-app@7.0.1
npm ERR!   node_modules/eslint-config-react-app
npm ERR!     eslint-config-react-app@"^7.0.1" from the root project       
npm ERR!   2 more (eslint-plugin-jest, eslint-plugin-jest)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! @typescript-eslint/eslint-plugin@"^8.14.0" from the root project 
npm ERR!
npm ERR! Conflicting peer dependency: @typescript-eslint/parser@8.14.0    
npm ERR! node_modules/@typescript-eslint/parser
npm ERR!   peer @typescript-eslint/parser@"^8.0.0 || ^8.0.0-alpha.0" from @typescript-eslint/eslint-plugin@8.14.0
npm ERR!   node_modules/@typescript-eslint/eslint-plugin
npm ERR!     @typescript-eslint/eslint-plugin@"^8.14.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR!
npm ERR!
npm ERR! For a full report see:
npm ERR! C:\Users\user\AppData\Local\npm-cache\_logs\2024-11-12T12_37_05_759Z-eresolve-report.txt

npm ERR! A complete log of this run can be found in: C:\Users\user\AppData\Local\npm-cache\_logs\2024-11-12T12_37_05_759Z-debug-0.log

Other packages

It's also blocking upgrading of other packages.