17

Even --force or --legacy-peer-deps didn't work.

Transcript:

npx create-react-app my-app

Creating a new React app in /home/zahid/my-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...

added 1353 packages in 2m

171 packages are looking for funding
  run `npm fund` for details

Initialized a git repository.

Installing template dependencies using npm...
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: my-app@0.1.0
npm ERR! Found: react@18.0.0
npm ERR! node_modules/react
npm ERR!   react@"^18.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"<18.0.0" from @testing-library/react@12.1.5
npm ERR! node_modules/@testing-library/react
npm ERR!   @testing-library/react@"^12.0.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! See /home/zahid/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/zahid/.npm/_logs/2022-04-11T22_25_02_229Z-debug-0.log

npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^12.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0 failed
ouflak
  • 2,408
  • 10
  • 40
  • 47

8 Answers8

9

This is going to solve the problem:

  1. npm config set legacy-peer-deps true

    Explanation:

    The --legacy-peer-deps flag was introduced with v7 as a way to bypass peerDependency auto-installation; it tells NPM to ignore peer dependencies and proceed with the installation anyway. This is how things used to be with NPM v4 through v6.

  2. npx create-react-app my-app

Peter Mortensen
  • 30,030
  • 21
  • 100
  • 124
  • 3
    OP mentioned "*--legacy-peer-deps didn't worked*", how is this different? – Bergi Apr 12 '22 at 11:00
  • 1
    Not sure what error OP has encountered; setting `legacy-peer-deps` do work for me as well. Instead of modifying default npm config, I used environment variable to turn on `legacy-peer-deps` just for this command and it worked. The command I actually use is something like `npm_config_legacy_peer_deps=true npx create-react-app my-app` – MrOrz Apr 12 '22 at 13:05
  • 3
    This is the *only* answer that explains the magic command line invocations. All the others are "try this" answers. – Peter Mortensen Apr 12 '22 at 14:13
  • 1
    This is also the only answer that worked for me too – Mitch Apr 13 '22 at 12:22
6

npm config set legacy-peer-deps true

Executing that helped me (on Linux).

ouflak
  • 2,408
  • 10
  • 40
  • 47
bey
  • 77
  • 2
  • 5
    What does this do? How does it work? OP mentioned "*--legacy-peer-deps didn't worked*", how is this different? – Bergi Apr 12 '22 at 10:59
  • I ran a wrong code with legacy-peer-deps. That's why didn't worded for me on linux. But above answered code worked for me nicely. Thanks. – BM. Zahidul Islam Apr 15 '22 at 11:01
1

Here is what worked for me:

  • Run npx create-react-app as normal and got the errors
  • Go into the package.json file and change the React version from 18.0.0 to 17.0.0
  • Delete the node_modules folder.
  • Then run npm install.

No more errors.

Peter Mortensen
  • 30,030
  • 21
  • 100
  • 124
1

This works for me

I changed this in my package.json (I downgraded the versions):

"react": "^18.0.0",
"react-dom": "^18.0.0",

To

"react": "^17.0.0",
"react-dom": "^17.0.0",

Then, remember to remove your folder /nodes_modules and run this in your project main folder:

npm i
Yorland
  • 21
  • 2
0

Try to run this command first:

npm config set legacy-peer-deps true

and then type the command

npx create-react-app app-name

It worked for me.

Peter Mortensen
  • 30,030
  • 21
  • 100
  • 124
  • 2
    Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Apr 12 '22 at 05:47
0

Try this:

  1. Delete folder node_modules and file package-lock.json
  2. Go to file package.json and change both react and react-dom's version to 17.0.0
  3. Now run npm install

Things should now work as expected.

Peter Mortensen
  • 30,030
  • 21
  • 100
  • 124
Vivek Kumar
  • 43
  • 1
  • 3
  • 1
    An explanation would be in order. E.g., why is it necessary to change the version number? What is it supposed to achieve? What is the idea/gist? Why does it work? From [the Help Center](https://stackoverflow.com/help/promotion): *"...always explain why the solution you're presenting is appropriate and how it works"*. Please respond by [editing (changing) your answer](https://stackoverflow.com/posts/71837844/edit), not here in comments (***without*** "Edit:", "Update:", or similar - the answer should appear as if it was written today). – Peter Mortensen Apr 12 '22 at 14:08
-1

Try to run this first:

npm config set legacy-peer-deps true

And try your command again. It worked with me!

Peter Mortensen
  • 30,030
  • 21
  • 100
  • 124
  • 3
    What does this do? How does it work? OP mentioned "*--legacy-peer-deps didn't worked*", how is this different? – Bergi Apr 12 '22 at 11:01
  • I ran a wrong code with legacy-peer-deps. That's why didn't worded for me on linux. But above answered code worked for me nicely. Thanks. @Bergi – BM. Zahidul Islam Apr 15 '22 at 11:03
-1

Use:

npm config set legacy-peer-deps true

I ran this code on cmd as @bey said and then tried to create an app. It worked without any issues on Windows 10. The fastest and easiest way is this one I believe. You can try to downgrade React (package React) and react-dom versions under 18 too.

Peter Mortensen
  • 30,030
  • 21
  • 100
  • 124
İlhan
  • 7
  • 3
  • 2
    Welcome to StackOverflow! This appears to be a comment on [another answer](https://stackoverflow.com/questions/71835029/suddenly-react-js-can-not-execute-create-react-app-command-why-this-is-happenin/71836424#71836424), with a suggestion of your own added in. If you agree with a solution, it's customary on this site to simply give an upvote. If you believe you have another solution, it's probably best to test it yourself and post the positive results here as an answer. – ouflak Apr 12 '22 at 12:52
  • Related: *[Why do I need 50 reputation to comment? What can I do instead?](https://meta.stackexchange.com/questions/214173/)*. – Peter Mortensen Apr 12 '22 at 14:17