ng build failing because of webpack : UNMET PEER DEPENDENCY - node.js

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.

Related

node modules deleted. now npm is not installing

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.

React 18.1.0 Dependency Tree Errors- can't resolve dependency tree

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]

Why node_modules\#angular-devkit\build-angular\src\browser is not supported resolving ES modules?

When I made changes to Angular code, they were no longer being reflected in the build. Google told me to delete node_modules and angular and reinstall. I did
rd /s node_modules
npm install
npm install --save --only=dev #angular/cli#latest
npm install -g #angular/cli#latest
Now when I do ng build, I'm getting error
node_modules#angular-devkit\build-angular\src\browser' is not
supported resolving ES modules
If I do ng update, it tells me everything seems to be in order.
I don't understand why a local and global version of angular is needed. It causes much confusion.
Also don't know why ng build stopped updating project, nor how to fix it. Fixes cause even more problems! Can anyone please shed some light?

react-scripts required old version of webpack

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.

create-react-app command aborting installation Why?

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

Resources