Bug: creation reactjs new project latest so v19

React version:19.0.0

Steps To Reproduce

1.npx create-react-app module
2. wait

Link to code example:

The current behavior

Creating a new React app in /..../module

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

added 1315 packages in 10m

261 packages are looking for funding
run npm fund for details

Initialized a git repository.

Installing template dependencies using npm...
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: module_loginweb_reactjs@0.1.0
npm error Found: react@19.0.0
npm error node_modules/react
npm error react@"^19.0.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer react@"^18.0.0" from @testing-library/react@13.4.0
npm error node_modules/@testing-library/react
npm error @testing-library/react@"^13.0.0" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error /.../.npm/_logs/2024-12-08T06_26_18_730Z-eresolve-report.txt
npm error A complete log of this run can be found in: ..

The expected behavior

no error

I am also facing this issue. I think the create-react-app you are trying to set up is using react@19.0.0, but @testing-library/react@13.4.0 requires react@^18.0.0.

I solved that by :
yarn create react-app module

I solved that by : yarn create react-app module

The issue has solved finally. thank you very much.

yes but it not quite solved by a "documented command" , but I am not on the right package name in fact . I will propagate

yes but it not quite solved by a "documented command" , but I am not on the right package name in fact . I will propagate

When things are settled, that's it.

Why is this issue marked as closed?
Using yarn instead of npx is not an excuse for fixing this bug

Agree, we should fix this instead of accepting a problem

hi, agree, in fact I recreated it there as son as I closed, with a link here : react/create-react-app#13726 6 but this repo has so many issues !!

I solved that by : yarn create react-app module

This is not a solution. Definitely not.

The official documentation recommends npx create-react-app my-app as the way to create a project. And that is not working anymore. It seams to me that we have a major bug.

Did not solve npx create-react-app app_name but manually changing the @testing-library/react to version 16.1.0 works for me. Seems like it's the compatible version with react 19

rm -rf node_modules package-lock.json

"dependencies": {
    "@testing-library/react": "^16.1.0",
    "cra-template": "1.2.0",
    "react": "^19.0.0",
    "react-dom": "^19.0.0",
    "react-scripts": "5.0.1",
  },

npm install

no errors on this

I wanted to create-react-app with typescript template and RTL but ran into this same issue.

Had to install RTL manually with types using command :

npm install --save-dev @testing-library/react @testing-library/dom @testing-library/jest-dom @testing-library/user-event @types/react @types/react-dom @types/jest @types/node --legacy-peer-deps

I have same issue

The same issue for me with npx (npx create-react-app my-app --template typescript),
but it works with yarn (yarn create react-app my-app --template typescript)

having same issue

Guys I use this trick to fix this issue:

npx create-react-app .
npm uninstall react react-dom
npm install react@18.2.0 react-dom@18.2.0
npm install --legacy-peer-deps
npm install web-vitals

Guys I use this trick to fix this issue:

npx create-react-app . npm uninstall react react-dom npm install react@18.2.0 react-dom@18.2.0 npm install --legacy-peer-deps npm install web-vitals

It's install React 18 but default version is 19.

I have been facing the same issue for the last two weeks. React v19 is making the process of creating a React app difficult and frustrating. I wonder what new learners must be going through.

Hey people, anyone found a solution for this? When using typescript template, I do not manage to solve the issues

Use:
npm config set legacy-peer-deps true

I got this from https://www.youtube.com/watch?v=glM8CBthVVg and is working for me now.

Completely new to React and facing the same issue now, and this just work for me!

Use: npm config set legacy-peer-deps true

I got this from https://www.youtube.com/watch?v=glM8CBthVVg and is working for me now.

Completely new to React and facing the same issue now, and this just work for me!

Use: npm config set legacy-peer-deps true
I got this from https://www.youtube.com/watch?v=glM8CBthVVg and is working for me now.

also for me, but I got this new problem, not related to the precedent...

yooppie-app@0.1.0 start
react-scripts start

Cannot find module 'ajv/dist/compile/codegen'
Require stack:

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\definitions\typeof.js
c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\typeof.js
c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\index.js
c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\index.js
c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\validate.js
c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\index.js
c:\Users\yuri1\yooppie-app\node_modules\webpack-dev-server\lib\Server.js
c:\Users\yuri1\yooppie-app\node_modules\react-scripts\scripts\start.js

Completely new to React and facing the same issue now, and this just work for me!

Use: npm config set legacy-peer-deps true
I got this from https://www.youtube.com/watch?v=glM8CBthVVg and is working for me now.

also for me, but I got this new problem, not related to the precedent...

yooppie-app@0.1.0 start
react-scripts start

Cannot find module 'ajv/dist/compile/codegen' Require stack:

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\definitions\typeof.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\typeof.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\index.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\index.js

c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\validate.js

c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\index.js

c:\Users\yuri1\yooppie-app\node_modules\webpack-dev-server\lib\Server.js

c:\Users\yuri1\yooppie-app\node_modules\react-scripts\scripts\start.js

Also for me, and I ran
npm list ajv
To check for the version then
npm install --save-dev ajv@^8 (replace 8 with the version it shows)
and fixed it.

Completely new to React and facing the same issue now, and this just work for me!

Use: npm config set legacy-peer-deps true
I got this from https://www.youtube.com/watch?v=glM8CBthVVg and is working for me now.

also for me, but I got this new problem, not related to the precedent...

yooppie-app@0.1.0 start
react-scripts start

Cannot find module 'ajv/dist/compile/codegen' Require stack:

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\definitions\typeof.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\typeof.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\index.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\index.js

c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\validate.js

c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\index.js

c:\Users\yuri1\yooppie-app\node_modules\webpack-dev-server\lib\Server.js

c:\Users\yuri1\yooppie-app\node_modules\react-scripts\scripts\start.js

Also for me, and I ran npm list ajv To check for the version then npm install --save-dev ajv@^8 (replace 8 with the version it shows) and fixed it.

my story is that I ran

npm install ajv --save-dev

then a bulk update for everythying

npx npm-check-updates -u
PLUS
npm install

and with another
npm start

...magically, everything was resolved and wrked so fine! now, ready for the next battle :-D

my story is that I ran

npm install ajv --save-dev

then a bulk update for everythying

npx npm-check-updates -u PLUS npm install

and with another npm start

...magically, everything was resolved and wrked so fine! now, ready for the next battle :-D

THis worked for me

Completely new to React and facing the same issue now, and this just work for me!

Use: npm config set legacy-peer-deps true
I got this from https://www.youtube.com/watch?v=glM8CBthVVg and is working for me now.

also for me, but I got this new problem, not related to the precedent...

yooppie-app@0.1.0 start
react-scripts start

Cannot find module 'ajv/dist/compile/codegen' Require stack:

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\definitions\typeof.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\typeof.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\keywords\index.js

c:\Users\yuri1\yooppie-app\node_modules\ajv-keywords\dist\index.js

c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\validate.js

c:\Users\yuri1\yooppie-app\node_modules\schema-utils\dist\index.js

c:\Users\yuri1\yooppie-app\node_modules\webpack-dev-server\lib\Server.js

c:\Users\yuri1\yooppie-app\node_modules\react-scripts\scripts\start.js

Also for me, and I ran npm list ajv To check for the version then npm install --save-dev ajv@^8 (replace 8 with the version it shows) and fixed it.

my story is that I ran

npm install ajv --save-dev

then a bulk update for everythying

npx npm-check-updates -u PLUS npm install

and with another npm start

...magically, everything was resolved and wrked so fine! now, ready for the next battle :-D

yes it works
Edit: for me, doing this so i dont anger the dev gods

I solved that by : yarn create react-app module

The issue has solved finally. thank you very much.

The only one worked for me

this bug appeared again when tried to install axios. pretty annoying.

Resolved the issue and template to start with react 19

https://github.com/164168AhmedSohail/React-19-working-solution-with-template

Navigation Menu

Repository navigation

Bug: creation reactjs new project latest so v19 #31701

Steps To Reproduce

The current behavior

The expected behavior

3 remaining items

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Bug: creation reactjs new project latest so v19 #31701

Description

Steps To Reproduce

The current behavior

The expected behavior

Activity

Kajanan02 commented on Dec 12, 2024

Productivix commented on Dec 12, 2024

toyota-167 commented on Dec 13, 2024

Productivix commented on Dec 13, 2024

toyota-167 commented on Dec 13, 2024

sankalpie commented on Dec 13, 2024

MagicFame commented on Dec 13, 2024

Productivix commented on Dec 14, 2024

lcrespilho commented on Dec 18, 2024

galuhalifani commented on Dec 20, 2024

avithe1 commented on Dec 23, 2024

petervn commented on Dec 25, 2024

volodymyrd commented on Dec 25, 2024

3 remaining items

IftekharulAlam commented on Jan 4, 2025

sankalpie commented on Jan 4, 2025

Kajanan02 commented on Jan 4, 2025

njoro-njoroge commented on Jan 5, 2025

villanuevadani commented on Jan 7, 2025

MelissaTrimarco commented on Jan 7, 2025

AoiSakuraLab commented on Jan 7, 2025

yuridicarlo commented on Jan 9, 2025

AoiSakuraLab commented on Jan 9, 2025

yuridicarlo commented on Jan 10, 2025

killermountain commented on Jan 13, 2025

Akshit0703 commented on Jan 16, 2025

IbrahimZawra commented on Jan 25, 2025

IbrahimZawra commented on Jan 25, 2025

164168AhmedSohail commented on Jan 29, 2025

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions