What does ` UNMET PEER DEPENDENCY <packageName> extraneous` mean? - npm

I understand that UNMET PEER DEPENDENCY means I need to npm install one of my peerDependencies. I believe that extraneous means the package exists but is not listed in package.json (presumably because it's installed globally?).
What does it mean to have the two of them together?
And why am I seeing this error even though I see these packages in node_modules, at the correct versions?

It means that you have a module installed in your local npm repo that is "extraneous" (meaning you have no dependency on it) that has an "unmet peer dependency" on a library you also do not have installed (or if you do have it installed locally or globally, it is also extraneous so it's not in your dependency tree). If you run npm prune it should remove the extraneous dependency and this message.

Related

How to remove optional peer dependency from NPM project?

I am participating in building a webapp that used to use node-sass. We migrated to sass in the meantime but we have still node-sass in our package-lock.json. I want to fix that.
In the beginning, we had something like this
$ npm ls node-sass
cookbook#0.9.13 /home/private/Documents/Projekte/nextcloud-apps/nextcloud-app-dev/volumes/custom_apps/cookbook
├── node-sass#7.0.1
└─┬ sass-loader#13.0.2
└── node-sass#7.0.1 deduped
OK, lets remove the dependency by calling npm uninstall node-sass. The result is
$ npm ls node-sass
cookbook#0.9.13 /home/private/Documents/Projekte/nextcloud-apps/nextcloud-app-dev/volumes/custom_apps/cookbook
└─┬ sass-loader#13.0.2
└── node-sass#7.0.1
I do not get the reason, why sass-loader is still depending on node-sass. OK, let's have a closer look:
$ npm why node-sass
node-sass#7.0.1 optional peer
node_modules/node-sass
peerOptional node-sass#"^4.0.0 || ^5.0.0 || ^6.0.0 || ^7.0.0" from sass-loader#13.0.2
node_modules/sass-loader
sass-loader#"^13.0.2" from the root project
peer sass-loader#"^13.0.1" from #nextcloud/webpack-vue-config#5.3.0
node_modules/#nextcloud/webpack-vue-config
dev #nextcloud/webpack-vue-config#"^5.0.0" from the root project
Now I am a bit surprised. The package node-sass is only installed as a peer dependency. So, why is it installed at all? I thought the idea of peer dependencies is to allow for the root project to select the version in use.
Also, it is only optional. So, it should be able to remove it (eventually there might be a warning during removal but nothing serious).
I am not working on the #nextcloud/webpack-vue-config package. It is a mere dev dependency of the webapp. So, NPM should not install the node-sass as a dev dependency on any of my dependencies.
How can I remove the node-sass package from my project's package-lock.json? It is still anchored in the package-lock.json and thus installed on each build.
I could use the --no-optional CLI option of npm to skip over all optional dependencies. I do not want to do that. The "problem" with this is that the GitHub dependency checker will not consider the node-sass module as skipped and continue complaining. Also, other optional dependencies might be skipped as well, although we would like to have them.
I ran into this with node-sass and sass-loader the other day.
Easy solve for me was to remove #nextcloud/webpack-vue-config from my package.json, do an npm install then put it back and rerun npm install
that was enough to get the internals reset to make node-sass go away.

How can I make npm install package and ignore one (or all) peer dependencies?

I have vuex#4.0.2 installed. I want to install vuex-module-decorators#latest, which has a peerDependency of vuex 3 (not >=3). I have a feeling this will work fine with vuex 4. Is there a way for me to tell npm to install this new package, without crashing due to not being able to resolve the peer dependency (since 4 != 3)? Or do I need to just create my own fork of vuex-module-decorators with an updated package.json that allows vuex >=3?
Using --legacy-peer-deps will usually allow you to install the package without meeting the peer dependency requirements. (This was the default using npm#6 so I assume you are using npm#7 if you are seeing a problem.) If that doesn't work, --force will install without regard to peer dependencies.
simply try this command
npm install --legacy-peer-deps
If you want peer dependencies to be automatically installed, add "auto-install-peers=true" to an .npmrc file at the root of your project

Making sure NPM dev dependencies match corresponding peer dependencies

I pretty much always end up adding my NPM modules peer dependencies to dev dependencies as well because I need the peer dependencies installed so I can run automated tests before building the package. This creates the problem that I might accidentally use different version number for peer and dev. I find it odd that npm and yarn do not install the peer dependencies automatically when I run npm install or the yarn command. In some cases I have found that yarn even tries to prevent me from adding the same dependency as both peer and dev dependency. I think I'm doing something wrong but I haven't been able to figure out the intended workflow. Can someone explain to me how this is supposed to work?

vue/cli 3 unmet dependencies

I tried the latest vue-cli 3 tool... full install
project setup is done correctly, but as soon as I add a new dependency, I get a list of warnings, unmet dependencies ... is it due to yarn ( I did not test npm..) or not. Anyway to solve them?
$ yarn add vue-i18n
yarn add v1.9.4
[1/4] 🔍 Resolving packages...
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
warning "#vue/cli-plugin-babel > babel-loader#8.0.0-beta.4" has unmet peer dependency "webpack#>=2".
warning "#vue/cli-plugin-eslint > eslint-loader#2.1.0" has unmet peer dependency "webpack#>=2.0.0 <5.0.0".
warning "#vue/cli-plugin-pwa > workbox-webpack-plugin#3.4.1" has unmet peer dependency "webpack#^2.0.0 || ^3.0.0 || ^4.0.0".
warning "#vue/eslint-config-prettier > eslint-config-prettier#2.10.0" has unmet peer dependency "eslint#>=3.14.1".
warning " > babel-core#7.0.0-bridge.0" has unmet peer dependency "#babel/core#^7.0.0-0".
warning " > sass-loader#7.1.0" has unmet peer dependency "webpack#^3.0.0 || ^4.0.0".
[4/4] 📃 Building fresh packages...
success Saved lockfile.
success Saved 1 new dependency.
info Direct dependencies
└─ vue-i18n#8.0.0
info All dependencies
└─ vue-i18n#8.0.0
✨ Done in 34.88s.
tl;dr: Probably not a problem except for webpack (but still probably not a problem). Since webpack is a peer dependency for multiple dependencies, non-deterministic behavior could arise due to different version constraints being listed in different dependencies.
What's Going On
Yarn presents these warnings to prevent different dependencies requiring different versions of a third sub-dependency, which may cause non-deterministic behavior. For instance here, babel-loader, eslint-loader, workbox-webpack-plugin, and sass-loader all have slightly different version constraints on webpack, which means without a yarn.lock file the version constraints are not exactly predictable. To resolve this, you could add webpack as an explicit dependency for your project, or you could yarn upgrade webpack#x.x.x to the version you desire then rely on your yarn.lock to specify this version.
The Solution
In your specific case, the only peer dependency you should be worried about is webpack because all the other ones are only required by a single dependency. However, its likely that no problems will arise if you were to just do nothing about these warnings.
Ideally, this should have been resolved by Vue in vue create process by adding webpack to the package.json, but since I am able to reproduce this error on my end I am guessing that they have not gotten around to it. I would encourage you to create an issue if one has hasn't already been made for this.
More info on Peer Dependencies
A project maintainer can specify peer dependencies in the project's package.json when they believe dependency conflicts could arise when using the package. For instance, if you visit the package.json for #vue/cli-plugin-babel then you will see webpack#>=2 listed in a peerDependencies section. Whoever wrote this Vue plugin likely added webpack as a peer dependency because they were aware how popular webpack is and wanted to warn the user that this plugin uses webpack so as to help them deal with potential conflicts.
While written with npm instead of yarn in mind, I found this article presents some useful advice for working with peer dependencies and peer dependency warnings.

Peer dependency errors from npm even though actual dependency version correctly follows semver

I'm getting npm ERR! invalid errors when I try npm ls or npm install, and it seems like npm is incorrectly thinking peers have incompatible versions. A good example (I get several of these at a time):
npm WARN unmet dependency /MYLOCALPROJECTDIRECTORY/node_modules/grunt-contrib-imagemin/node_modules/imagemin/node_modules/imagemin-gifsicle requires image-type#'^0.1.1' but will load
npm WARN unmet dependency /MYLOCALPROJECTDIRECTORY/node_modules/grunt-contrib-imagemin/node_modules/imagemin/node_modules/image-type,
npm WARN unmet dependency which is version 0.1.4
According to the rules of semver, the caret "^" operator should match a requirement of ^0.1.1 with an actual dependency of version 0.1.4 just fine.
I've installed Node v0.10.30 with npm v1.4.23 using Homebrew (both the latest stables), running OS X Mountain Lion. I'd appreciate tips on finding how to reliably reproduce this - last time I totally uninstalled/reinstalled Node and npm, same local npm modules and everything, and could not find the error again. Came back to work the next day, tried to install some grunt plugin, and ran into all these errors again.
If you happen to reproduce it, I bet you can solve it by removing the node_modules folder, cleaning the cache and reinstalling:
rm -rf ./node_modules
npm cache clean
npm install
I know this is not an actual answer, but I guess it's better than uninstalling/reinstalling node/npm.