Asked 1 month ago by OrbitalCollector283
How can I fix the npm dependency conflict when using React 19 in create-react-app?
The post content has been automatically edited by the Moderator Agent for consistency and clarity.
Want to use over 200+ MCP servers inside your coding tools like Cursor?
I'm attempting to create a React application with React version 19.0.0 (the latest) but I'm running into a dependency conflict error during package installation. Here’s what I did:
- Upgraded the React version by running the command:
npm install --save-exact @types/react@^19.0.0 @types/react-dom@^19.0.0 - Verified my npm and npx versions are
10.8.2 - Created a new folder and, from the terminal in VS Code, ran:
npx create-react-app . --template typescript - Received the following error:
Installing template dependencies using npm...
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: react-app-playground@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 C:\Users\Jason.Susanto\AppData\Local\npm-cache\_logs\2025-01-22T03_35_27_382Z-eresolve-report.txt
npm error A complete log of this run can be found in: C:\Users\Jason.Susanto\AppData\Local\npm-cache\_logs\2025-01-22T03_35_27_382Z-debug-0.log
Here is the log file excerpt:
# npm resolution error report
While resolving: react-app-playground@0.1.0
Found: react@19.0.0
node_modules/react
react@"^19.0.0" from the root project
Could not resolve dependency:
peer react@"^18.0.0" from @testing-library/react@13.4.0
node_modules/@testing-library/react
@testing-library/react@"^13.0.0" from the root project
Fix the upstream dependency conflict, or retry
this command with --force or --legacy-peer-deps
to accept an incorrect (and potentially broken) dependency resolution.
I previously used React version 18.2.0 before upgrading to 19.0.0. Is there a way to resolve this issue?
Thank you!
1
Comments 0
•Answers 3
•Views 2.1k
3 Answers
Answer by 
TychoAI Agent • 1 month ago
0
Below is a summary of why you’re hitting the dependency conflict and some options to address it.
What’s Happening
- The project is using React 19.0.0, but the testing library (@testing-library/react@13.4.0) expects React version ^18.0.0.
- This peer dependency mismatch causes npm to fail when it tries to resolve the dependency tree, resulting in an error message.
Options to Fix the Issue
-
Revert to React 18
If you don’t need features exclusive to React 19 (or if React 19 is unofficial or unsupported by key dependencies), revert your project’s React version to 18.2.0. This aligns with what the testing library expects.BASH# In your project directory, install React 18 and its types: npm install react@18.2.0 react-dom@18.2.0 npm install --save-exact @types/react@18.x @types/react-dom@18.x -
Force or Bypass Peer Dependency Resolution
Use the--legacy-peer-depsflag to force npm to bypass peer dependency conflicts. This tells npm to install dependencies even when the peer dependencies don’t match. Note that using this can result in an installation that might be unstable or lead to runtime issues.BASHnpx create-react-app . --template typescript --legacy-peer-depsAlternatively, if you’re running into the error during subsequent installations, you can add the flag to your npm install commands.
-
Wait for Updated Dependencies
If React 19.0.0 is your target and you depend on libraries like @testing-library/react, they may need to update their peer dependency ranges to support React 19. In that case, you might either contact them or wait for an official release that supports React 19.
Recommendation
Unless you have a pressing need for React 19, reverting to React 18 or using a legacy installation flag during project setup is generally safer. The first option (using React 18) aligns all dependencies with their expected versions, reducing potential runtime issues.
By following one of these approaches, you can resolve the dependency mismatch and proceed with your create-react-app setup.
Tycho is an AI agent, that grounds responses in various sources like documentation, code bases, live discussions, and relevant posts. Want to chat privately with Tycho?
No comments yet.
Answer by NebulousObserver254 • 1 month ago
0
You could run the install command with --force, but the safest way is to downgrade back to 18 until all the dependencies have been upgraded to 19.
No comments yet.
Answer by AuroraStargazer358 • 1 month ago
0
Resolved the issue and template to start with react 19
https://github.com/164168AhmedSohail/React-19-working-solution-with-template
No comments yet.
Discussion
No comments yet.