Error npx create-react-app my-app --template typescript

[rzahuseyin1993]

No description provided.

[seamoonpandey]

@rzahuseyin1993
can you please add the details about the issue.

[DimitrenkoNikolayFusion]

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/fusion/.npm/_logs/2024-12-08T12_43_16_224Z-eresolve-report.txt
npm error A complete log of this run can be found in: /Users/fusion/.npm/_logs/2024-12-08T12_43_16_224Z-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

@seamoonpandey

[axalix]

It's a copy of facebook/create-react-app#13717

[nighilramachandran]

any one have any idea to solve the above issue

[axalix]

@nighilramachandran

yarn create react-app my-app --template typescript

[Lempwick]

JESUS THANK YOU @axalix

[saitejayelubolu]

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

[Hafsaelharrak]

@saitejayelubolu thank you sooo much ive literally been stuck for more than two hours i kept trying and trying and i literally have a react exam tomorrow morning so i was in deep problems i saw someone in here say that react is deprecated and its better to use vite to create a react app in 2024 i did that but i then decided to delete all that since my professor will not accept that so i had one last hope on your comment and it actually worked may god bless you thank you so much

[gaomigithub]

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

Great one, thank you.

[TrickyZergg]

Before creating the app use this command: npm config set legacy-peer-deps true. After that, use the npx create-react-app and after the process is fully done, change the legacy-peer-deps back to false like this: npm config set legacy-peer-deps false. Hope it works for you guys. It did for me.

[Sr-Stroncio]

Thx @axalix

[Yangbao-Jin]

why react team doesn't take any actions to fix this issue? it's a long time.

[saitejayelubolu]

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
{/* */}

then

npm start

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

[YourLov3r]

wow, it seems i will not use react anymore. this is piece of shit

[TomasBarry]

The quick start guide fails because of this.

[akhra92]

@saitejayelubolu Thank you! It worked for me and you saved me a couple of hours;)