npx create-react-app

[JingqiGao-2]

Why after react19 was released npx create-react-app demo --template typescript typescript has dependency issues

[Greg-Myers-SB]

Confirmed.

Installing template dependencies using npm...
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.
npm error
npm error
npm error For a full report see:
npm error /Users/gregory.myers/.npm/_logs/2024-12-06T11_49_25_590Z-eresolve-report.txt
npm error A complete log of this run can be found in: /Users/gregory.myers/.npm/_logs/2024-12-06T11_49_25_590Z-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 web-vitals@^2.1.0` failed

[irvelervel]

Confirmed, we're already talking about it here -> https://github.com/facebook/create-react-app/issues/13715

[yhojann-cl]

Wrong repository, the problem is not for React Scripts, is Testing Library for React: https://github.com/testing-library/react-testing-library/issues/1372

[saitejayelubolu]

This is for React and Typescript

Typescript React follows these steps:

npm install -g typescript

then

npm uninstall react react-dom

then

npm install react@18 react-dom@18

then

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

then

npx tsc --init

then

npx tsc --build --clean

then

npm install --save-dev typescript

then

open the tsconfig.json replace code below

{ "compilerOptions": { "target": "es5", "lib": ["dom", "es2015"], "allowJs": true, "jsx": "react-jsx", // Add this line to enable JSX handling "moduleResolution": "node", "strict": true, "esModuleInterop": true, "skipLibCheck": true, "forceConsistentCasingInFileNames": true }, "include": [ "src" ] }

then

goto src/App.tsx

comment 2nd line // import logo from "./logo.svg";

comment 9th line {/* logo */}

then

npm start

or you can go with this YouTube link: https://youtu.be/_0_kW0xI7P8?si=JWDu0Lyskflmdjol

[saitejayelubolu]

This is for React JS

the first step is to locate your project folder

then run these commands one by one

npm uninstall react react-dom

then

npm install react@18 react-dom@18

then

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 web-vitals@^2.1.0

then

npm start

here what we are doing is uninstalling react19 and installing react18.

or you can go with this YouTube link: https://youtu.be/mUlfo5ptm1o?si=hYHTwc7hApEXzPX5

[Greg-Myers-SB]

This was fixed by https://github.com/facebook/create-react-app/pull/13738 and could now be closed.

Do you have a new issue @saitejayelubolu or did that fix not work?

[JingqiGao-2]

This was fixed by #13738 and could now be closed.

Do you have a new issue @saitejayelubolu or did that fix not work?

I'll have a try