I am currently having trouble solving dependency tree error with React 18. Initially, I couldn't start a new react project with npx-create-react-app my-app (a template was not provided). I fixed that and can now start a new project, but I have two other react apps that I cannot get to start up.
The first one is a portfolio react template that I downloaded. I opened it up and ran npm start in the terminal with no luck (attached is the dependency tree error message).
These are the steps I took to try to fix it:
I deleted all react and node folders that were dowloaded on my Mac (outside of the directory).
Ran npm install --save --legacy-peer-deps
Ran rm -rf node_modules
Ran npm cach clean --force
I removed package.lock.json
I changed these scripts in package.json to updated versions
nodemon: 2.0.16
react: 18.1.0
react-scripts: 5.0.1
React-dom: 18.1.0
When I then run npm start I get the dependency errors. I would appreciate any help and advice! Thanks so much![!dependency errors]
Related
I deleted the node modules and package.json.lock file in my client side MERN Stack project folder and tried reinstalling the node modules by typing "npm install" command in the terminal. but it's showing me an error. 1. I have tried clearing cache using "npm cache clean --force".
2. I have tried reinstalling npm using "npm install -g npm".
3. I have tried updating the npm using "npm install -g npm#latest".
But nothing works. Please help me resolve this issue. below are my package.json file and the error in my terminal while installing node modules.
i was expecting that node modules will be reinstalled with all the dependencies mentioned in my package.json file.
NPM changed the way of resolving peer dependencies in v7, but this new way does not allow conflicting dependencies in the dependency tree. The simplest way to solve this would be to use the --legacy-peer-deps option to use the old way of resolving dependencies.
The hard(but better) way to solve it would be to spend some time to update the dependencies in a way that there is no conflicting dependency.
I installed webpack into my react project, but the same error occurred every time when I use npm start:
The react-scripts package provided by Create React App requires a dependency:
"webpack": "4.42.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of webpack was detected higher up in the tree:
C:\react\minimoj\node_modules\webpack (version: 4.43.0)
I tried to remove package-loc.json file + all node_modules + remove webpack name from package.json and reinstall it with npm install. Also I tried same with yarn, but it didn't help. I see that in node_modules version is 4.43 and after I use npm install webpack in the file package-loc.json it shows 4.43, but at the moment when I use npm start it changed to 4.42 and error occur. In addition I also reinstall node.js but it didn't help.
create .env file and add SKIP_PREFLIGHT_CHECK=true
I had similar with a newer webpack version being installed than what react_scripts required.
To fix I deleted webpack and webpack-dev-server from my project's node_modules, went to a console outside of the project dir and ran
npm uninstall webpack
npm uninstall webpack-dev-server
Then ran
npm install
npm run build
And all was well, as my package.json was correct without change.
Since webpack is mostly focused on common js according to some websites, I just tried rollup for my react project and it proved to be much more effective as it supports es+. I would highly recommend it. I took a couple minutes to have everything setup and ready. Also, as a good practice it is better to use yarn as npm has had a lot of known issues for node app management.
I was trying to deploy my solution using serverless but faced an issue, which led me to update webpack. And now I am facing altogether a new issue:
If I try to build my app i.e. ng build --configuration=qa, if I do it without explicit entry of webpack in devdependencies, then I get webpack not found error and npm ls webpack shows below:
If I install webpack via npm install --save webpack or with -i, I get below issue:
What just happened? Even If I restore my solution to previous conditions, when ng build was working, now it doesn't. I've tried deleting the node_modules and cache verify and all, but nothing seems to work?
What did I just mess up? Please help me understand.
windows 10
node v10.15.1
npm v6.8.0;
I:\>npx create-react-app newpomodoro
Creating a new React app in I:\newpomodoro.
Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts...
npm ERR! Unexpected end of JSON input while parsing near '...:"^2.2.x","topo":"1.x'
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache_logs\2019-03-03T17_21_57_703Z-debug.log
Aborting installation.
npm install --save --save-exact --loglevel error react react-dom react-scripts has failed.
Deleting generated file... package.json
Deleting newpomodoro/ from I:\
Done.
I installed react globaly and loacaly as well but still it was giving me same error.
Can anyBody tell me whats going wrong.
Use this command:
npm cache clean --force
I am having this same problem with npm install --save --save-exact --loglevel error react react-dom react-scripts has failed. Mine then deletes node_modules and package.json. I have asked about this here: NPX create-react-app aborting installation after vulnerabilities found
I have already tried to use npm cache clean --force but this has not solved the problem. I have also tried installing different versions of node.js to no avail.
I ran into a similar issue. I don't know if you might have been in the same boat, but the cause was a space in my path name. I often save my projects on google file stream which has a space in the name ("G:/My Drive/..."). I tried creating the app in another directory and moving the folder which ended up working out.
The command npm clean --cache won't help.
If you are facing an abort installation error in react.
The abort installation error generated because of the older node version.
you should update your node package version.
To solve, run the following command and it will solve the abort installation error.
nvm install node 12.18.0
So, update your node package to the latest one. Once you've updated your node package then create your react app as follows:
npx create-react-app <your-app-name>
The abort installation error occurred because the outdated version of your node was not supporting the create-react-app command and deleted the node_modules and package.json file
Try this, please. It solved my error and hopefully, it'll solve your error too.
The issue was in node version just update it to latest version and it work's for me!
https://nodejs.org/en/download/
here is the solution which works for me, first of all, you should update all of your dependencies
then ran the command
npm cache clean --force
after that you can use
npx create-react-app
I removed all node_modules from my project and installed it again.
Before removing them everything was working fine. Now I'm getting an error at the end of webpack build :
After it happened I:
uninstalled webpack completely with -g option, installed it locally with npm install in my project.
uninstalled nodejs completely both with brew and manually removing all suspected files related to node or npm
installed nodejs with brew again.
Unfortunatelly I'm still getting the same error.
When I try to run the project with npm run dev where dev in package.json file is: "dev": "webpack-dev-server --progress --colors"
I'm getting the following error :
where ./app/index.jsx is the entry file for my project
Before all was fine, the directory structure was indentical, I haven't touched anything in the project apart from removing node_modules and installing it all again.
webpack version: 1.13.2 node version: 7.0.0 webpack-dev-server
version: 1.16.2
Any ideas greatly appreciated.
Thanks
Answering my own question just in case someone encounters the same issue:
I did the following steps:
remove webpack and webpack-dev-server from the package.json file
remove node_modules folder
run npm install
install both again (latest versions) npm install --save-dev webpack webpack-dev-server
After installing them the versions are as follows:
webpack: 1.13.3 (was 1.13.2 before) | webpack-dev-server: 1.16.2
Done!
1.remove foldernode_modules
2.run npm install
thx! my problems is solved by these two steps only !