NPM peer dependencies error - angularjs

Im doing this tutorial on angular js. Im a complete newbie and have never touched it before but would love to learn. I am doing this tutorial here
https://www.youtube.com/watch?v=ofASsumsf7E
However im having issues when trying to run the npm install command. This is the error that i am getting.
npm WARN peerDependencies The peer dependency grunt#~0.4.0 included from grunt-c
ontrib-copy will no
I have no idea how to debug this but its a big roadblock for me. I can try to find other tutorials but I like this one. Can somebody help?

peerDependencies are deprecated in the latest npm versions. This is why you have the warning.
When you use gruntyou install it locally (which isn't the case in that project from what I can see : https://github.com/colorfest/angularjs/blob/master/package.json).
You may have to run npm install grunt at the root of the project.

Related

React requiring a peer React-Dom

I am quite new in React and front end dev.
I am following a tutorial from udemy that require to install react-simple-sidenav module in order to get a NavBar.
However when I try to install it no way to make it work. I get the following error message after running the command npm install react-simple-sidenav
And the navBar doest not work event if it is copy past from the tuto
npm WARN react-simple-sidenav#0.1.6 requires a peer of react-dom#^15.0.0 but none is installed. You must install peer depe
ndencies yourself.
Could you help me ?
You need to install react-dom from NPM library, in your command line type the following:
npm i -s react-dom

Creating the react app issue with npm

I tried creating the new react app and for that i have followed the reactjs command to install like npm install -g create-react-app. But its not working and i am getting the error as npm ERR! Cannot find module 'pseudomap'. So for that i have uninstalled the nodejs 3 times and installed freshly. But still no luck for me. Can anybody provide any solution for this.
See below screens:

Unmet peer dependencies for create-react-native-app

I'm trying React Native out using create-react-native-app version 1.0.0. Upon trying to create a new project, I get the following errors and warnings in the middle of the logs:
├── UNMET PEER DEPENDENCY react#^0.14.0 || ^15.0.0-0 || ^16.0.0-0
and
│ ├── UNMET PEER DEPENDENCY react#>=15.3.1
and
npm WARN react-native-gesture-handler#1.0.0-alpha.17 requires a peer of react#>= 16.0.0 but none was installed.
npm WARN react-native-branch#2.0.0-beta.3 requires a peer of react#>=15.4.0 but none was installed.
npm WARN lottie-react-native#1.1.1 requires a peer of react#>=15.3.1 but none was installed.
What is the proper way to resolve these issues?
You're gonna want to make sure your create-react-native-app package is up to date. You might also have a global install of react that's messing things up which is why CRNA isn't able to get react for you.
Do npm upgrade -g create-react-native-app then try again.
If that doesn't work straight off then try removing your global react install and then be sure to add it to your package.json for your local projects. Make sense?
UPDATE:
the next thing to try is to manually install the missing packages.
npm i -g react
I would imagine CRNA installs react as one if it's dependencies but maybe not...
Are you using nvm to manage your node versions? if so make sure you're using a required node version.
That error is telling you that it can't install React for some reason (which is a problem because, well, you kinda need react). Let me know if upgrading works and if not I'll get some more info from ya and we'll figure it out! cheers.
I had the same issue on Windows after the first installation of Node.js 8.4.0.
I didn't have Node.js installed prior to this.
Did a reinstall of Node.js and after that it worked.

Unmet peer dependency installing react

I have two related questions. I'm installing react into a new empty project. I only have a basic package.json file in the folder, nothing else.
The message I get is
+-- UNMET PEER DEPENDENCY react-addons-css-transition-group#0.14.x || 15.x.x
First, question: Am I interpreting this correctly? Message is saying, either install the react-addons-css-transition-group#0.14.x package or install react version 15.x.x?
Second, by running npm install react --save, I installed react version 15.5.4. If my interpretation of the message is correct, why am I getting the message? I already have react 15.5.4 installed.
Your first interpretation is correct. You can have either version.
But it's not complaining about react, but complaining about react-addons-css-transition-group. You need to install react-addons-css-transition-group along with react.
I found an article that indicated that this is a bug and can be solved by upgrading to the latest version of npm.
So I removed all my npm packages which was not issue for me because it's a new project. If you have an existing project, you may not need to do that. I just wanted to have a clean slate.
I then cleaned up my package.json and upgraded npm on my computer to latest version using npm-windows-upgrade.
I then did a clean npm install react and this time I did not get any error messages.

How do I fix the npm UNMET PEER DEPENDENCY warning?

I'm on Windows 10, with Node 5.6.0 and npm 3.6.0. I'm trying to install angular-material and mdi into my working folder. npm install angular-material mdi errors with:
+-- angular#1.5.0
+-- UNMET PEER DEPENDENCY angular-animate#^1.5.0
+-- UNMET PEER DEPENDENCY angular-aria#^1.5.0
+-- angular-material#1.0.6
+-- UNMET PEER DEPENDENCY angular-messages#^1.5.0 `-- mdi#1.4.57
npm WARN enoent ENOENT: no such file or directory, open
'C:\Users\xxxxx\Desktop\ngClassifieds\package.json'
npm WARN angular-material#1.0.6 requires a peer of
angular-animate#^1.5.0 but none was installed.
npm WARN angular-material#1.0.6 requires a peer of angular-aria#^1.5.0
but none was installed.
npm WARN angular-material#1.0.6 requires a peer of
angular-messages#^1.5.0 but none was installed.
How do I resolve this to get AngularJS Material and MDI installed?
npm no longer installs peer dependencies so you need to install them manually, just do an npm install on the needed deps, and then try to install the main one again.
Reply to comment:
it's right in that message, it says which deps you're missing
UNMET PEER DEPENDENCY angular-animate#^1.5.0 +--
UNMET PEER DEPENDENCY angular-aria#^1.5.0 +-- angular-material#1.0.6 +
UNMET PEER DEPENDENCY angular-messages#^1.5.0 `-- mdi#1.4.57`
So you need to npm install angular angular-animate angular-aria angular-material angular-messages mdi
UNMET PEER DEPENDENCY error is thrown when the dependencies of one or more modules specified in the package.json file is not met.
Check the warnings carefully and update the package.json file with correct versions of dependencies.
Then run
rm -rf node_modules/
npm cache clean
npm install
This will install all the required dependencies correctly.
In my case all the dependencies were already there. Please update NPM in that case as it might have been crashed. It solved my problem.
npm install -g npm
npm-install-peers worked for me.
npm install -g npm-install-peers
EDIT 2020
From npm v7.0.0, npm automatically installs peer dependencies. It is one of the reasons to upgrade to v7.
https://github.blog/2020-10-13-presenting-v7-0-0-of-the-npm-cli/
Also this page explains the rationale of peer dependencies very well.
https://github.com/npm/rfcs/blob/latest/implemented/0025-install-peer-deps.md
This answer doesn’t apply all cases, but if you can’t solve the error by simply typing npm install
, this steps might help.
Let`s say you got this error.
UNMET PEER DEPENDENCY packageA#4.2.0
npm WARN packageB#3.3.0 requires a peer of packageA#^3.1.0 but none was installed.
This means you installed version 4.2.0 of packageA, but packageB#3.3.0 needs version 3.x.x of pakageA. (explanation of ^)
So you can resolve this error by downgrading packageA to 3.x.x, but usually you don`t want to downgrade the package.
Good news is that in some cases, packageB is just not keeping up with packageA and maintainer of packageB is trying hard to raise the peer dependency of packageA to 4.x.x.
In that case, you can check if there is a higher version of packageB that requires version 4.2.0 of packageA in the npm or github.
For example, Go to release page
Oftentimes you can find breaking change about dependency like this.
packageB v4.0.0-beta.0
BREAKING CHANGE
package: requires packageA >= v4.0.0
If you don’t find anything on release page, go to issue page and search issue by keyword like peer. You may find useful information.
At this point, you have two options.
Upgrade to the version you want
Leave error for the time being, wait until stable version is released.
If you choose option1:
In many cases, the version does not have latest tag thus not stable. So you have to check what has changed in this update and make sure anything won`t break.
If you choose option2:
If upgrade of pakageA from version 3 to 4 is trivial, or if maintainer of pakageB didn’t test version 4 of pakageA yet but says it should be no problem, you may consider leaving the error.
In both case, it is best to thoroughly test if it does not break anything.
Lastly, if you wanna know why you have to manually do such a thing, this link explains well.
One of the most possible causes of this error could be that you have defined older version in your package.json. To solve this problem, change the versions in the package.json to match those npm is complaining about.
Once done, run npm install and voila!!.
The given answer wont always work. If it does not fix your issue. Make sure that you are also using the correct symbol in your package.json. This is very important to fix that headache. For example:
warning " > #angular/compiler-cli#5.2.7" has incorrect peer dependency "typescript#>=2.4.2 <2.7".
warning " > tsickle#0.25.6" has incorrect peer dependency "typescript#>=2.4.2 <2.6".
So my typescript needs to be between 2.4.2 and 2.6 right?
So I changed my typescript library from using "typescript": "^2.7" to using "typescript": "^2.5". Seems correct?
Wrong.
The ^ means that you are okay with npm using "typescript": "2.5" or "2.6" or "2.7" etc...
If you want to learn what the ^ and ~ it mean see: What's the difference between tilde(~) and caret(^) in package.json?
Also you have to make sure that the package exists. Maybe there is no "typescript": "2.5.9" look up the package numbers. To be really safe just remove the ~ or the ^ if you dont want to read what they mean.
Ok so i struggled for a long time trying to figure this out. Here is the nuclear option, for when you have exhausted all other ways..
Make a new folder on your pc.
Download a brand new installation of angular - I used this guide: https://coursetro.com/posts/code/55/How-to-Install-an-Angular-4-App
Run it, make sure it works
Then install your dependancies one by one from your package.json file
Run it after each one is installed
When you are done, and it still works, import your actual code into this new project. Fix any compile errors the newer version of angular causes.
Thats what did it for me.. 1 hour of rework vs 6 hours of trying to figure out wtf was wrong.. wish i did it this way to start..
Today available Angular 2 rc.7, and I had a similar problem with rxjs#5.0.0-beta.12 UNMET PEER DEPENDENCY.
If you, like me, simply replaced #angular/...rc.6 to #angular/...rc.7 - it's not enough. Because, for example, #angular/router has no rc.6 version.
In this case, better review package.json in Quick start
This issue can also occur when trying to fix a security vulnerability issue on a dependency.
Here is what I did:
Audited installed dependencies
npm audit
If there are fix available, running the following would fix the issue most of the time:
npm audit fix
Some issues would have SEMVER WARNING, following the link would give us hint on how to do a manual review and/or what to do next.
Doing a bit more research led me to discovering this command:
npm upgrade
Seems npm audit fix did not account on updating peer dependencies, and running npm upgrade would fixed unmet peer dependencies.
Now check if we resolved the issue by running:
npm list
This will give us all dependencies for our project and warn us of any unmet peer deps errors. Upgrading for the most part is actually better than staying on older version of the package you are using, if you are not having a security vulnerability issue npm install is also a viable option.
You will get this warning if you are using npm v6 or before. After npm v7.0, npm development team has stated that they will automatically install peer dependencies, all together. Therefore, now you don't want to install your peer dependencies manually.
You can install npm v7.0 using this command,
npm install -g npm#7
Learn more about npm v7.0 from this blog post, published by the Github Blog.
In case you wish to keep the current version of angular, you can visit this version compatibility checker to check which version of angular-material is best for your current angular version. You can also check peer dependencies of angular-material using angular-material compatibility.
I removed package-lock.json and node_module , switch over to YARN and this solved the issue
I was receiving the following error:
warning " > react-native#0.68.2" has unmet peer dependency "react#17.0.2".
It looks like the main reason was that that I had the "react-native" package installed aside from the "npx react-native" that comes with the node install.
Once I removed the 'react-native' package, I was able to successfully use "npx react-native init packagename" syntax.
You can check the react-native documentation regarding the above issue on the react native site:
https://reactnative.dev/docs/environment-setup
you can resolve by installing the UNMET dependencies globally.
example : npm install -g #angular/common#4.4.6
install each one by one.
its worked for me.

Resources