Error with npx create-react-app my-app

[ateregulov]

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
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.

0 verbose cli C:\Program Files\nodejs\node.exe C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js
1 info using [email protected]
2 info using [email protected]
3 silly config load:file:C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\npmrc
4 silly config load:file:C:\Users\Artur\Documents\Reps\oris-app\my-app2.npmrc
5 silly config load:file:C:\Users\Artur.npmrc
6 silly config load:file:C:\Users\Artur\AppData\Roaming\npm\etc\npmrc
7 verbose title npm install @testing-library/jest-dom@^5.14.1 @testing-library/react@^13.0.0 @testing-library/user-event@^13.2.1 web-vitals@^2.1.0
8 verbose argv "install" "--no-audit" "--save" "@testing-library/jest-dom@^5.14.1" "@testing-library/react@^13.0.0" "@testing-library/user-event@^13.2.1" "web-vitals@^2.1.0"
9 verbose logfile logs-max:10 dir:C:\Users\Artur\AppData\Local\npm-cache_logs\2025-01-10T13_45_12_400Z-
10 verbose logfile C:\Users\Artur\AppData\Local\npm-cache_logs\2025-01-10T13_45_12_400Z-debug-0.log
11 silly logfile start cleaning logs, removing 1 files
12 silly packumentCache heap:4345298944 maxSize:1086324736 maxEntrySize:543162368
13 silly logfile done cleaning log files
14 silly idealTree buildDeps
15 silly fetch manifest @testing-library/jest-dom@^5.14.1
16 silly packumentCache full:https://registry.npmjs.org/@testing-library%2fjest-dom cache-miss
17 http fetch GET 200 https://registry.npmjs.org/@testing-library%2fjest-dom 1493ms (cache updated)
18 silly packumentCache full:https://registry.npmjs.org/@testing-library%2fjest-dom set size:undefined disposed:false
19 silly fetch manifest @testing-library/react@^13.0.0
20 silly packumentCache full:https://registry.npmjs.org/@testing-library%2freact cache-miss
21 http fetch GET 200 https://registry.npmjs.org/@testing-library%2freact 313ms (cache updated)
22 silly packumentCache full:https://registry.npmjs.org/@testing-library%2freact set size:undefined disposed:false
23 silly fetch manifest react@^19.0.0
24 silly packumentCache full:https://registry.npmjs.org/react cache-miss
25 http cache https://registry.npmjs.org/react 28ms (cache hit)
26 silly packumentCache full:https://registry.npmjs.org/react set size:5325544 disposed:false
27 silly fetch manifest react@^18.0.0
28 silly packumentCache full:https://registry.npmjs.org/react cache-miss
29 http cache https://registry.npmjs.org/react 44ms (cache hit)
30 silly packumentCache full:https://registry.npmjs.org/react set size:5325544 disposed:false
31 verbose stack Error: unable to resolve dependency tree
31 verbose stack at #failPeerConflict (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\node_modules@npmcli\arborist\lib\arborist\build-ideal-tree.js:1363:25)
31 verbose stack at #loadPeerSet (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\node_modules@npmcli\arborist\lib\arborist\build-ideal-tree.js:1329:33)
31 verbose stack at async #buildDepStep (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\node_modules@npmcli\arborist\lib\arborist\build-ideal-tree.js:904:11)
31 verbose stack at async Arborist.buildIdealTree (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\node_modules@npmcli\arborist\lib\arborist\build-ideal-tree.js:181:7)
31 verbose stack at async Promise.all (index 1)
31 verbose stack at async Arborist.reify (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\node_modules@npmcli\arborist\lib\arborist\reify.js:131:5)
31 verbose stack at async Install.exec (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\lib\commands\install.js:150:5)
31 verbose stack at async Npm.exec (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\lib\npm.js:207:9)
31 verbose stack at async module.exports (C:\Users\Artur\AppData\Roaming\npm\node_modules\npm\lib\cli\entry.js:69:5)
32 error code ERESOLVE
33 error ERESOLVE unable to resolve dependency tree
34 error
35 error While resolving: [email protected]
35 error Found: [email protected]�[2m�[22m
35 error �[2mnode_modules/react�[22m
35 error react@"^19.0.0" from the root project
35 error
35 error Could not resolve dependency:
35 error �[95mpeer�[39m react@"^18.0.0" from @testing-library/[email protected]�[2m�[22m
35 error �[2mnode_modules/@testing-library/react�[22m
35 error @testing-library/react@"^13.0.0" from the root project
35 error
35 error Fix the upstream dependency conflict, or retry
35 error this command with --force or --legacy-peer-deps
35 error to accept an incorrect (and potentially broken) dependency resolution.
36 error
36 error
36 error For a full report see:
36 error C:\Users\Artur\AppData\Local\npm-cache_logs\2025-01-10T13_45_12_400Z-eresolve-report.txt
37 silly unfinished npm timer reify 1736516713269
38 silly unfinished npm timer reify:loadTrees 1736516713270
39 silly unfinished npm timer idealTree:buildDeps 1736516714252
40 silly unfinished npm timer idealTree:#root 1736516714253
41 verbose cwd C:\Users\Artur\Documents\Reps\oris-app\my-app2
42 verbose os Windows_NT 10.0.26100
43 verbose node v22.13.0
44 verbose npm v11.0.0
45 verbose exit 1
46 verbose code 1
47 error A complete log of this run can be found in: C:\Users\Artur\AppData\Local\npm-cache_logs\2025-01-10T13_45_12_400Z-debug-0.log

npm resolution error report

While resolving: [email protected]
Found: [email protected]
node_modules/react
react@"^19.0.0" from the root project

Could not resolve dependency:
peer react@"^18.0.0" from @testing-library/[email protected]
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.

[javafuns]

I got the same error :-(

[pro2on]

I have the same error

[Kivylius]

same here, what going on?

node: v20.11.0
npm: 10.2.4
win11

[visionscaper]

Same here.

node: v23.6.0
npm: 11.0.0
MacOS 15.2 (24C101)

[pmharris77]

I get the same error, but seems to only be an issue when creating the app with the npm npx create-react-app my-app command. If you install yarn and use that instead, it seems to work for me:

npm install --global yarn
yarn create react-app my-app

node: 20.16.0
npm: 9.2.0
yarn: 1.22.22
Linux 6.11 Ubuntu 24.10 24.10 (Oracular Oriole)

[harrydehix]

Same error here. Clearing the cache or using create-react-app@latest did not help. I updated npm to the latest version (11.0.0) and I'm using the current node LTS version (v22.13.0).

[pmharris77]

Been doing some research and technically, create-react-app is deprecated and no longer maintained, despite still being referenced by many online tutorials, so I doubt there will be a fix for this... A better alternative would be next.js or vite, which are more modern and lightweight.

With vite you can get going simply with:

npm create vite@latest my-app -- --template react
npm install
npm run dev

See https://vite.dev/guide/ for more info.

[rayonnunes]

I've managed to make CRA back to work by doing some workarounds:

Source code

1. Use node 18 (nvm recommended):

nvm install 18

2. Downgrade react from ^19.0.0 to ^18.3.1 and react-scripts from 5.0.1 to 4.0.3 in package.json

- "react": "^19.0.0",
- "react-dom": "^19.0.0",
- " react-scripts": "5.0.1",
+ "react": "^18.3.1",
+ "react-dom": "^18.3.1",
+ " react-scripts": "4.0.3",

3. Remove node_modules and package-lock.json then run npm i

4. Upgrade react-scripts back to 5.0.1 and run npm i (do not remove node_modules or package-lock.json this time)

5. Install community types

npm i --save-dev @types/react @types/react-dom @types/jest 

6. remove src/reportWebVitals.ts file and its reference

7. Optional for typescript: add the following tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx"
  },
  "include": [
    "src"
  ],
  "exclude": [
    "**/*.test.ts",
    "**/*.test.tsx",
    "**/*.spec.ts",
    "**/*.spec.tsx"
  ]
}

8. Optional for testing:

npm install --save-dev ts-jest @testing-library/react @testing-library/jest-dom jest-environment-jsdom 
npx ts-jest config:init

8.1 Update your jest.config.js

- testEnvironment: "node"
+ testEnvironment: "jest-environment-jsdom"
+ moduleNameMapper: {
+     "\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":
+       "<rootDir>/tests/__mocks__/fileMock.ts",
+     "\\.(css|less)$": "<rootDir>/tests/__mocks__/styleMock.ts",
+   },
+   setupFilesAfterEnv: ["<rootDir>/tests/setupJest.ts"],

8.2 Create a new folder tests at the root and a new file setupJest.ts:

import "@testing-library/jest-dom";

8.3 Under tests create a new folder __mocks__ and two files:
fileMock.ts - for media files

export default "test-file-stub";

styleMock.ts

export default {};

I've created a new react app using CRA only for educational purposes, I truly recommend everyone to deprecate this method of in favor of vite template or Next.js

[boldandbusted]

Been doing some research and technically, create-react-app is deprecated and no longer maintained, despite still being referenced by many online tutorials, so I doubt there will be a fix for this... A better alternative would be next.js or vite, which are more modern and lightweight.

With vite you can get going simply with:

npm create vite@latest my-app -- --template react
npm install
npm run dev

See https://vite.dev/guide/ for more info.

Hey there. Can you share a link to an announcement of the deprecation of create-react-app? Indeed it is still core to this tutorial: https://www.w3schools.com/REACT/default.asp . Cheers.