How to set React version to react@17 when i use npx create-react-app ?

[liuzhaowei55]

I create a cra templte, but it does not work with react@18 yet, how to set the defautl react version to react@17?

[JitenderKumar2001]

You can set dependencies > "react-dom": "^18.0.0" to "react-dom": "^17.0.0" or you can reinstall react with @17 version.

[liuzhaowei55]

You can set dependencies > "react-dom": "^18.0.0" to "react-dom": "^17.0.0" or you can reinstall react with @17 version.

I created a cra templte, and used mobx, mobx can not work with react@18 yet, when I use npx create-react-app --template aio, got an error like this:

Installing template dependencies using npm...
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
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!   peer react@"^18.0.0" from react-dom@18.0.0
npm ERR!   node_modules/react-dom
npm ERR!     react-dom@"^17.0.2" from the root project
npm ERR!     peer react-dom@"^17.0.0 || ^18.0.0" from @mui/material@5.6.0
npm ERR!     node_modules/@mui/material
npm ERR!       @mui/material@"^5.4.4" from the root project
npm ERR!     1 more (@testing-library/react)
npm ERR!   peer react@">= 16" from react-scripts@5.0.0
npm ERR!   node_modules/react-scripts
npm ERR!     react-scripts@"5.0.0" from the root project
npm ERR!     peer react-scripts@"^5.0.0" from @craco/craco@7.0.0-alpha.3
npm ERR!     node_modules/@craco/craco
npm ERR!       @craco/craco@"^7.0.0-alpha.3" from the root project
npm ERR!   6 more (the root project, @emotion/react, @emotion/styled, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! mobx-react-lite@"^3.3.0" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: react@17.0.2
npm ERR! node_modules/react
npm ERR!   peer react@"^16.8.0 || ^17" from mobx-react-lite@3.3.0
npm ERR!   node_modules/mobx-react-lite
npm ERR!     mobx-react-lite@"^3.3.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 /Users/where/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/where/.npm/_logs/2022-04-11T13_08_13_767Z-debug-0.log

so I need to lock the react with @17.

---

Good news is I got a solution, add resolutions to the templage.json > package, and use yarn create react-app --template aio instead npx xxx

[raymondKelly]

For some additional context on what I see

npm ERR! Could not resolve dependency:
npm ERR! peer react@"<18.0.0" from @testing-library/react@12.1.5

[AkifumiSato]

Similar results were obtained with npx create-react-app xxx.
Is this planned to be fixed in the next release?

Installing template dependencies using npm...
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: test-front@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 /Users/<user-name>/.npm/eresolve-report.txt for a full report.

[arobbins]

Getting the same error

[camilosegura]

Looks like this is the issue testing-library/react-testing-library#1041

[xchen0326]

Getting the exactly same error as AkifumiSato.

[jooonathann]

It seems that web-vitals is causing an error on create-react-app.

Anyway, what i did to resolve the issue for now is :
1_delete both node_modules and package-lock.json
2_run "npm i web-vitals --save-dev"
3_run "npm install"
and then you can use "npm run build" and "npm start" again

[jooonathann]

forgot to mention, you can change to react 17 by deleting node_modules and package-lock.json, then on package.json change "react": "^18.0.0" and "react-dom": "^18.0.0" to "react": "^17.0.2" and "react-dom": "^17.0.2" or the version that you want, then run "npm install"

[xchen0326]

Yes, manually changing the "react" and "react-dom" version and then npm install works for me. Thanks.

[eps1lon]

Testing Library React 12.x only works with React < 18
Testing Library React 13.x only works with React 18

Make sure that these versions match.

If there are still issues then please provide a minimal, cloneable repository that I can check out.

[jplwood]

This issue exists more broadly for any dependencies that are not yet ready to use React 18. (I'm having this issue because we have an internal library that isn't able to work with v18 yet) -- From what I can see, there is no way to use an old version of create-react-app anymore because it disallows use of global CRA with npx. We can't specify preferred CRA version, can't specify preferred react version without manually changing things after generating the app. Why is it so locked down? Am I missing something?

[arikadiusz]

Having the same issue. Unable to downgrade from v18 to v17 due to dependency errors.