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: my-app2@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.

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 npm@11.0.0
2 info using node@v22.13.0
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: my-app2@0.1.0
35 error Found: react@19.0.0�[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/react@13.4.0�[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: my-app2@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.

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

[GorlikItsMe]

Solution: Dont use create-react-app unsupported garbage.

Do this:

bun create vite my-react-app --template react-ts
cd my-react-app
bun install
bun run dev

[ori1202]

Solution: Dont use create-react-app unsupported garbage.

Do this:

bun create vite my-react-app --template react-ts
cd my-react-app
bun install
bun run dev

As the last person mentioned, React is known to be unstable, and it encourages you to use tools exclusively within its ecosystem (e.g., Vite). In fact, if you visit their official website here, they no longer mention the script npx create-react-app my-app. Instead, they recommend using frameworks like Next.js or Remix over vanilla React. Lastly, you can also use Parcel to work with vanilla React without the bloated node_modules that typically come with React projects. See more details here.