could not create react project - reactjs

I was trying to create a react project using the command
npx create-react-app chat-app
But I am getting this error.
Creating a new React app in /home/mikhil/react-tutorial/internshala-react-course/chat-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR! npm ERR! Found: #babel/core#undefined
npm ERR! node_modules/#babel/core npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer #babel/core#"^7.0.0-0" from #babel/preset-env#7.13.10
npm ERR! node_modules/#babel/preset-env
npm ERR! #babel/preset-env#"^7.12.1" from #svgr/webpack#5.5.0
npm ERR! node_modules/#svgr/webpack
npm ERR! #svgr/webpack#"5.5.0" from react-scripts#4.0.3
npm ERR! node_modules/react-scripts
npm ERR! react-scripts#"*" 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! See /home/mikhil/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/mikhil/.npm/_logs/2021-03-18T11_58_50_255Z-debug.log
Aborting installation. npm install --save --save-exact --loglevel
error react react-dom react-scripts cra-template has failed.
Deleting generated file... package.json
Deleting chat-app/ from /home/mikhil/react-tutorial/internshala-react-course
Done.

You can try to update npm with npm update and see if that fixes it, and if not you can try these steps.
If you've previously installed create-react-app globally via npm install -g create-react-app, it is recommend you uninstall the package using npm uninstall -g create-react-app or yarn global remove create-react-app to ensure that npx always uses the latest version.
You will also want to delete your remnant files and folders for chat-app
Once you are in the /home/mikhil/react-tutorial/internshala-react-course directory and you have removed the global installations you can try running these commands.
npx create-react-app my-app
cd my-app
npm start
Create React App - Getting Started

I was having the same issue with NPM version 7.20.0.
Simply install an older version of NPM.
In the terminal run: npm install npm#6.14.11 -g

There appears to be some particular versions of NPM that cause this issue. Try updating to the very latest version of NPM.

I was also trying to do the same the whole day, then at last I have to open the documentation, there it was mentioned that you can also create react app using
npm init create-react-app **app_name**
and it worked for me fine.
I was troubled very much by this dependency thing.

Related

Create react app throwing errors 'unable to resolve dependency tree' and 'fix upstream dependency conflict'

I've been trying use create react app but when I go to create it in the terminal i get this error.
Installing template dependencies using npm...
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: test3#0.1.0
npm ERR! Found: react#18.0.0
npm ERR! node_modules/react
npm ERR! react#"^18.0.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"<18.0.0" from #testing-library/react#12.1.5
npm ERR! node_modules/#testing-library/react
npm ERR! #testing-library/react#"^12.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! See /Users/chrisheibel/.npm/eresolve-report.txt for a full report.
npm ERR!`
I've tried using --legacy-peer-deps and --force with no luck. It will create the app but npm start does not work. Once i've created it i've tried to install/update npm and node again with no luck. I've also uninstalled node and npm globally on my computer and reinstalled with no luck, as well as turning react and react-dom in the created app to version 17 instead of 18 but had no luck there.
I'm at a bit of a loss on this one as create react app has always worked on my computer before. But maybe you guys might know if i'm missing something here and that's why I can't run npm start/ am getting all these errors.
The error message is telling you what the issue is. The important parts are:
Found: react#18.0.0
and
peer react#"<18.0.0" from #testing-library/react#12.1.5
So #testing-library/react#12.1.5 is only compatible with react <18 and you have added react 18, which breaks this rule. Upgrade #testing-library/react to a compatible version or downgrade react to < 18.
the latest version of #testing-library/react is 13. so you should likely have something like
"#testing-library/react": "^13.0.0"
in your package.json
I'd check your version of create-react-app
create-react-app --version
Mine says 5.0.0.
The documentation says to uninstall create-react-app and run it using npx. Running with npx will install the latest version:
npm uninstall -g create-react-app
npx create-react-app your-app-name
When I run create-react-app today I get a react v18 app. In some cases I've had to downgrade it to v17. I've done this as follows:
npm uninstall react react-dom
npm install react#!7 react-dom#17

Problem to install react-reveal animation on terminal visual studio code

Hello everybody i have a probem to install the react-reveal animation dependencie , each time when i put this command (npm install react-reveal --save) I have this problem, and i don't how i can resolve this problem, if a person had this problem or know how resolve this problem. can help me please thank you.
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: portfolio-sebastien#0.1.0
npm ERR! Found: react#17.0.2
npm ERR! node_modules/react
npm ERR! react#"^17.0.2" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^15.3.0 || ^16.0.0" from react-reveal#1.2.2
npm ERR! node_modules/react-reveal
npm ERR! react-reveal#"*" 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! See /home/sebastienfirouzfar/.npm/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /home/sebastienfirouzfar/.npm/_logs/2021-06-17T08_40_33_036Z-debug.log
This is because react-reveal has not been updated in about 4 years as you can see here https://github.com/rnosov/react-reveal. Its dependencies are looking for react 15 or 16. You have react v17 so its throwing an error that it might not work with that version.
I can confirm that react-reveal works fine for me with react v17. But you will need to install react-reveal with this command:
npm i react-reveal --legacy-peer-deps.
Or if you already have the packages in your package.json then you can install everything without the errors by using npm i --legacy-peer-deps.
An alternative option is that you can ditch react-reveal and use react-awesome-reveal instead. This package does similar fade and reveals for react but its API is slightly different and does not have all the advanced features of react-reveal. This would only be a replacement if you were using only the basic features of react-reveal.
You are having this problem probably because of cache or npm version so I will try to give you most feasible solution.
1-Delete your node_modules and package-lock.json files from your project.
2-Run npm cache clean --force in termial
3-Run npm install
4-Run npm install react-reveal --save
If it does not work you should try with different node version. You can use nvm (node version manager) which allows you to use and switch multiple node versions in your computer.
just for a quick solution you can use npm i react-reveal --force

I am trying to install new component using npm. But it gives error

I was trying to add $ npm install react-native-touchable-bounce --save but it was giving an error the same as the following.
then I deleted all node_modules still getting this error.
npm install gives the following error.
PS I:\Code\singal res\code\singalRes> npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: undefined#undefined
npm ERR! Found: react-native-svg#12.1.0
npm ERR! node_modules/react-native-svg
npm ERR! react-native-svg#"^12.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react-native-svg#"^9.13.6" from #ui-kitten/components#5.0.0
npm ERR! node_modules/#ui-kitten/components
npm ERR! #ui-kitten/components#"^5.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! See C:\Users\softb\AppData\Local\npm-cache\eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\softb\AppData\Local\npm-cache\_logs\2021-02-14T03_13_39_660Z-debug.log
for me adding the --force flag fixed the issue
npm i --force
maybe it's because of the lib version mismatch, you can delete the package-lock.json and node_modules,
then try npm install again.
Temporary Solution
This issue can be fixed by running npm i your-dependency --force .
This issue occurs because npm can't automatically fix the dependencies
mismatch.
Cause
If you want to know why this happen go here.
Permanent Solution
If you never heard about yarn, its new package manager came after npm. it is very similar to npm and it has many benefits. one of them is it can automatically fix this issue.
How to install yarn.
By the way, there are many new emerging package managers too pnpm and others.

NPX create-react-app cannot find a matching version for #typescript-eslint/experimental-utils#2.19.1

I'm on a new computer and tried to run npx create-react-app myapp and I am receiving this error. Never had this before, it looks like it's missing the es-lint package?
$ npx create-react-app my-app
npx: installed 99 in 4.157s
Creating a new React app in C:\Users\Name\Documents\demos\my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...
npm ERR! code ETARGET
npm ERR! notarget No matching version found for #typescript-eslint/experimental-utils#2.19.1.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.
npm ERR! notarget
npm ERR! notarget It was specified as a dependency of '#typescript-eslint/eslint-plugin'
npm ERR! notarget
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Name\AppData\Roaming\npm-cache\_logs\2020-02-10T19_41_06_770Z-debug.log
Aborting installation.
npm install --save --save-exact --loglevel error react react-dom react-scripts cra-template has failed.
Deleting generated file... package.json
Deleting my-app/ from C:\Users\Name\Documents\demos
Done.
Looks like this is now a known bug in the release of typescript-eslint version 2.19.1 a couple hours ago and they're working on fixing it at the moment:
https://github.com/typescript-eslint/typescript-eslint/issues/1588
UPDATE:
This was a problem with NPM - and there were likely other builds affected.
https://status.npmjs.org/incidents/1dpd0zjyhj2v
Either way, this has been resolved.

The 'npx create-react-app' is not working (missing dependency)

I don't know how to solve this dependency issue. Some months ago I did use the create-react-app without any problems.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
PS C:\Users\me\Desktop\React> npx create-react-app my-app
Creating a new React app in C:\Users\me\Desktop\React\my-app.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
npm ERR! code ETARGET
npm ERR! notarget No matching version found for confusing-browser-globals#^1.0.9
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.
npm ERR! notarget
npm ERR! notarget It was specified as a dependency of 'eslint-config-react-app'
npm ERR! notarget
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\me\AppData\Roaming\npm-cache\_logs\2019-09-24T11_36_58_826Z-debug.log
Try this,
npm install
npm start

Resources