create-react-app installs [email protected] causing peer dependency #13717
Comments
|
same problem |
|
Same for me |
|
same issue |
1 similar comment
|
same issue |
|
same |
|
same question |
|
i think you should change react to 18 in [you project]package.json `"dependencies": { |
|
I have same problem when i run audit-fix-force a few days ago, react 19 so bad |
|
Thanks, but
I’d like to create react project using just one command just as before: npx create-react-app myprog .
without project folder, how can i change the package.json in the project folder? it’s chicken and eggs problem~
and i’d like to know why i can not use one command to create a react project all of a sudden?
Best,
Jim
… On Dec 8, 2024, at 06:39, innocence ***@***.***> wrote:
i think you should change react to 18 in [you project]package.json `"dependencies": {
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
***@***.***/jest-dom": "^5.17.0",
***@***.***/react": "^13.4.0",
***@***.***/user-event": "^13.5.0",
***@***.***/jest": "^27.5.2",
***@***.***/node": "^16.18.121",
***@***.***/react": "^18.3.14",
***@***.***/react-dom": "^18.3.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-scripts": "^3.0.1",
"typescript": "^4.9.5",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"ajv": "^7.2.4"
}
}
and use Node16
—
Reply to this email directly, view it on GitHub <#13717 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AKMXKRS2A3YOWZM32MSSZ632ERK3JAVCNFSM6AAAAABTF3KJZCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDKMRWGEYDINJTGY>.
You are receiving this because you authored the thread.
|
did you try "npm install react@18 react-dom@18" when finish create this project ? React 19 will change 18.3.1 |
|
did you try "npm install ***@***.*** ***@***.***" when finish create this project ? React 19 will change 18.3.1
The porblem is i can NOT finish creating react project using the" npx create-react-app myprog” command . How can i try "npm install ***@***.*** ***@***.***” before i successfully finishing creating the react project?
Please offer me the step by step guidance.
Thanks!
… On Dec 8, 2024, at 11:55, JonesKhaii ***@***.***> wrote:
Thanks, but I’d like to create react project using just one command just as before: npx create-react-app myprog . without project folder, how can i change the package.json in the project folder? it’s chicken and eggs problem~ and i’d like to know why i can not use one command to create a react project all of a sudden? Best, Jim
… <x-msg://3/#>
On Dec 8, 2024, at 06:39, innocence @.> wrote: i think you should change react to 18 in [you project]package.json `"dependencies": { { "name": "test", "version": "0.1.0", "private": true, "dependencies": { @./jest-dom": "^5.17.0", @./react": "^13.4.0", @./user-event": "^13.5.0", @./jest": "^27.5.2", @./node": "^16.18.121", @./react": "^18.3.14", @./react-dom": "^18.3.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "^3.0.1", "typescript": "^4.9.5", "web-vitals": "^2.1.4" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, "devDependencies": { "ajv": "^7.2.4" } } and use Node16 — Reply to this email directly, view it on GitHub <#13717 (comment) <#13717 (comment)>>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKMXKRS2A3YOWZM32MSSZ632ERK3JAVCNFSM6AAAAABTF3KJZCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDKMRWGEYDINJTGY. You are receiving this because you authored the thread.
did you try "npm install ***@***.*** ***@***.***" when finish create this project ? React 19 will change 18.3.1
—
Reply to this email directly, view it on GitHub <#13717 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AKMXKRTZSBKE55WA5MBL4CT2ESP35AVCNFSM6AAAAABTF3KJZCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDKMRWGM2TIMBVGQ>.
You are receiving this because you authored the thread.
|
|
and when use npm start after i use "npm install ***@***.*** ***@***.***” before the project fully successfully created .the chrome display:
ERROR in ./src/reportWebVitals.js 5:4-24
Module not found: Error: Can't resolve 'web-vitals' in '/Users/jim/projects/myprog/src'
… On Dec 8, 2024, at 11:55, JonesKhaii ***@***.***> wrote:
Thanks, but I’d like to create react project using just one command just as before: npx create-react-app myprog . without project folder, how can i change the package.json in the project folder? it’s chicken and eggs problem~ and i’d like to know why i can not use one command to create a react project all of a sudden? Best, Jim
… <x-msg://4/#>
On Dec 8, 2024, at 06:39, innocence @.> wrote: i think you should change react to 18 in [you project]package.json `"dependencies": { { "name": "test", "version": "0.1.0", "private": true, "dependencies": { @./jest-dom": "^5.17.0", @./react": "^13.4.0", @./user-event": "^13.5.0", @./jest": "^27.5.2", @./node": "^16.18.121", @./react": "^18.3.14", @./react-dom": "^18.3.2", "react": "^18.2.0", "react-dom": "^18.2.0", "react-scripts": "^3.0.1", "typescript": "^4.9.5", "web-vitals": "^2.1.4" }, "scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject" }, "eslintConfig": { "extends": [ "react-app", "react-app/jest" ] }, "browserslist": { "production": [ ">0.2%", "not dead", "not op_mini all" ], "development": [ "last 1 chrome version", "last 1 firefox version", "last 1 safari version" ] }, "devDependencies": { "ajv": "^7.2.4" } } and use Node16 — Reply to this email directly, view it on GitHub <#13717 (comment) <#13717 (comment)>>, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKMXKRS2A3YOWZM32MSSZ632ERK3JAVCNFSM6AAAAABTF3KJZCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDKMRWGEYDINJTGY. You are receiving this because you authored the thread.
did you try "npm install ***@***.*** ***@***.***" when finish create this project ? React 19 will change 18.3.1
—
Reply to this email directly, view it on GitHub <#13717 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AKMXKRTZSBKE55WA5MBL4CT2ESP35AVCNFSM6AAAAABTF3KJZCVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDKMRWGM2TIMBVGQ>.
You are receiving this because you authored the thread.
|
|
This fixes it, until the problem is updated. [after creating the react app, with errors...]
|
|
|
|
same problem for me. I can't see that any tsconfig.json file was created |
|
how to solve the same problem? I thought I made the problem |
The workaround by @DoozyDoz does indeed work. Thanks Doozy! The other suggested workarounds (edit Actually - maybe they do work for a plain JS app - I don't know. I'm creating an app using the |
|
I'm having the same problem |
|
Hi everyone, In the package json specify react and react-dom versions, this worked for me.
Cheers. |
This works for my case. Thanks. Hope the React development team can quickly fix this. This is the entrance for a React project and it gives me a very bad image for the project quality. Now sure how the develop team can let this issue happen without a full test. |
|
Is this project abandoned? last commit was 4 months ago. Tons of opened issues and MRs with no attention. |
|
Same problem. |
|
Same problem |
|
Temporary measures： |
|
I used create-vite to setup the boilerplate code for a react app: https://vite.dev/guide/#scaffolding-your-first-vite-project |
|
Having trouble with Create React App (CRA)? Consider switching to Vite, a modern build tool offering a faster, smoother React development experience. Here's how to set up a new React project using Vite: # Create new Vite project
npm create vite@latest my-react-app
# Navigate to project directory
cd my-react-app
# Install dependencies
npm install
# Start dev server
npm run devSwitching to Vite can save time and reduce complexity, especially if you're encountering errors with CRA. Give it a try and let me know how it works for you! |
|
@qaidjoharj53 did you try it yourself? What React version have you got installed? Did you read the title? Vite doesn't maintain React 19 [yet]: vitejs/vite#18917 |
|
@axalix I understand the title is about React 19. |
|
@qaidjoharj53 I appreciate your intention, but this thread is not about Vite, nor about React 18. |
|
It looks like a react19-related issue, and some react19-based websites are also inaccessible, such as https://designable-antd.formilyjs.org/ For details, please see this issue below： |
|
I have the same problem 😑 |
|
Same issue here with typescript template > npx create-react-app new-client --template typescript
Creating a new React app in /Users/zact/Projects/new-client.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template-typescript...
added 1320 packages in 11s
265 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: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"^19.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^18.0.0" from @testing-library/[email protected]
npm ERR! node_modules/@testing-library/react
npm ERR! @testing-library/react@"^13.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!
npm ERR! For a full report see:
npm ERR! /Users/zact/.npm/_logs/2024-12-14T03_33_42_989Z-eresolve-report.txt
npm ERR! A complete log of this run can be found in: /Users/zact/.npm/_logs/2024-12-14T03_33_42_989Z-debug-0.log
`npm install --no-audit --save @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 @types/jest@^27.0.1 @types/node@^16.7.13 @types/react@^18.0.0 @types/react-dom@^18.0.0 typescript@^4.4.2 web-vitals@^2.1.0` failed |
|
same problem |
If you put './App.tsx' the problem is gone. For some reason we need to put extension in this version. |
They would make CRA not support React 19 also. I tried Next.js and it did not solve my problem, because when I use fs dependencies it says you cannot run it on the client side. It wants to force me to use it on the BackEnd, but I want to use it on the frontEnd. Will Vite solve this issue? `./node_modules/fs.realpath/old.js:24:10
|
and others
Describe the Bug
When creating a new React app using npx create-react-app myprog, the installation fails due to dependency resolution issues. Specifically, create-react-app installs [email protected] by default, which conflicts with dependencies like @testing-library/[email protected] that require react@"^18.0.0". This problem persists even when using the --legacy-peer-deps flag or specifying [email protected].
Did you try recovering your dependencies?
Yes, I followed the suggested recovery steps:
Deleted the node_modules, package-lock.json, and yarn.lock (if applicable).
Reinstalled dependencies with npm:
bash
複製程式碼
npm install -g npm@latest
npm install
Used a clean directory for npx create-react-app.
Despite these efforts, the issue persists.
Which terms did you search for in User Guide?
I searched the following terms in the Create React App Documentation:
"dependency conflict"
"peer dependency"
"react@19"
"legacy-peer-deps"
None of the solutions resolved the issue.
Environment
Here is the output of npx create-react-app --info:
yaml
複製程式碼
Environment Info:
current version of create-react-app: 5.0.1
running from /Users/jim/.npm/_npx/c67e74de0542c87c/node_modules/create-react-app
System:
OS: macOS 14.6.1
CPU: (8) x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
Binaries:
Node: 22.12.0 - /usr/local/bin/node
Yarn: 1.22.22 - /usr/local/bin/yarn
npm: 10.9.2 - ~/.npm-global/bin/npm
Browsers:
Chrome: 131.0.6778.71
Edge: Not Found
Safari: 17.6
npmPackages:
react: Not Found
react-dom: Not Found
react-scripts: Not Found
npmGlobalPackages:
create-react-app: Not Found
Steps to Reproduce
Install Node.js LTS version (22.12.0).
Run npx create-react-app myprog or npx create-react-app myprog --legacy-peer-deps.
Observe the dependency resolution error.
Expected Behavior
The project should initialize successfully with compatible versions of react, react-dom, and all other dependencies. Specifically, it should install react@18 instead of react@19, as the latter is not yet compatible with the current create-react-app dependency chain.
Actual Behavior
The project initialization fails with the following error:
vbnet
複製程式碼
npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: [email protected]
npm error Found: [email protected]
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/[email protected]
npm error node_modules/@testing-library/react
npm error @testing-library/react@"^13.0.0" from the root project
Reproducible Demo
This issue occurs in a clean environment. Steps to reproduce:
Delete any existing node_modules or lock files:
bash
複製程式碼
rm -rf node_modules package-lock.json
Run:
bash
複製程式碼
npx create-react-app myprog
Alternatively, use:
bash
複製程式碼
npx create-react-app myprog --legacy-peer-deps
The issue persists in both cases.
Additional Notes
This issue appears to be caused by [email protected] being marked as the latest release on npm. However, @testing-library/react and other dependencies still require react@18.
I attempted the following workarounds, but none resolved the issue:
Specifying [email protected]:
bash
複製程式碼
npx create-react-app myprog --scripts-version [email protected]
Using --legacy-peer-deps:
bash
複製程式碼
npx create-react-app myprog --legacy-peer-deps
Manually installing react@18 and react-dom@18 before running create-react-app.
This appears to be an ecosystem issue that requires either:
A change in create-react-app to explicitly lock React to version 18.
Updates to dependencies like @testing-library/react to support React 19.
The text was updated successfully, but these errors were encountered: