132

I have a fresh install of yarn (via npm install yarn -g) and tried to install a few packages with

yarn add vue-loader babel-loader style-loader css-loader file-loader webpack

I then got a few warnings during the installation, such as

warning "vue-loader@13.3.0" has unmet peer dependency "vue-template-compiler@^2.0.0".

A sister question (about npm) on the same subject yields a few answers which suggest to

  1. update npm
  2. remove node_modules as there is a bug in npm about handling dependencies.

I cannot discard the packages in the warnings, as the webpack build fails, which leads to me having to manually install them. At the same time, quite a few dependencies were installed so I do not understand why these were not installed.

What does the above warning mean, and why doesn't yarn install these dependencies on its own?

2
  • 2
    I am not a native speaker and I have just observed "X has unmet peer dependency Y" message on my laptop. Until I googled this SO question I thought the sentence meant "[installing] X has caused dependencies of Y not to be met", while they mean "X has got unmet peer dependencies..." Feb 18, 2019 at 21:25
  • Potential duplicate: stackoverflow.com/questions/42361942/… Jun 16, 2021 at 1:00

3 Answers 3

77

What is a peer dependency

Here is some useful reading on dependency types, and here is info on peer dependencies, but to summarize:

Dependency: A library/package your project needs to run.
Peer dependency: Used to indicate a library/package your project will hook in to.

The package vue-loader has a peer dependency on vue-template-compiler - vue-loader acts as a plugin for vue-template-compiler

Why aren't peer dependencies installed by default

Peer dependencies were automatically installed up until npm@3 (which yarn has followed in). This was stopped due to frequently confusing behavior. For example, installing another plugin with a conflicting requirement would result in an error.

We will also be changing the behavior of peerDependencies in npm@3. We won’t be automatically downloading the peer dependency anymore. Instead, we’ll warn you if the peer dependency isn’t already installed. This requires you to resolve peerDependency conflicts yourself, manually, but in the long run this should make it less likely that you’ll end up in a tricky spot with your packages’ dependencies. [Feb 13, 2015]

Update

As per here npm@7 now installs peer dependencies.
For the motivation behind this decision see here

6
  • 8
    It's just a warning but normally if a dependency is not met the execution will fail. So why does it seem possible to just ignore this warning?
    – Jean Paul
    Oct 6, 2020 at 8:58
  • 99
    What am I supposed to do? I'm using yarn. Should I ignore this or manually install?? You have only mentioned about npm's update not about yarn. Question is about yarn.
    – Akhila
    Nov 27, 2020 at 13:53
  • 15
    Nothing about yarn! The question is for yarn not npm.
    – Luciens
    May 10, 2021 at 3:25
  • 1
    @JeanPaul 2 possible reasons. Firstly if the peer dependency is optional. Secondly if the peer dependency is a dependency of some other installed package, but not listed in package.json, you'll still see the warning even though the package is available.
    – Mr5o1
    Jul 28, 2021 at 23:04
  • 2
    @Akhila for yarn users, add the unmet peer dependency like this yarn add '@babel/core@^7.0.0-0' (replacing @babel/core@^7.0.0-0 with the name of the unmet peer dependency from the warning message. More info here.
    – stevec
    Feb 23 at 23:55
14

Running yarn install --check-files or just yarn install can fix the issue and install the missing depecendencies.

Explicitly adding to your package.json may also be an option.

Reference https://github.com/yarnpkg/yarn/issues/4594#issuecomment-763475899

2
  • 2
    No any of these yarn commands worked for me, the warning dependency is still there.
    – fguillen
    Aug 4, 2022 at 7:13
  • Adding the missing package to the package.json should always work, even if it is suboptimal
    – lcapra
    Aug 5, 2022 at 14:12
4

As others have mentioned, peer dependencies are other packages required by a library that must be added to the dependencies of the parent package rather than directly within the library.

To resolve this warning you should run yarn add <package> for each <package> that is complained about. Below is an example.

Original output from yarn install:

$ yarn install
yarn install v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.3.2: The platform "linux" is incompatible with this module.
info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
warning " > react-markdown@8.0.3" has unmet peer dependency "@types/react@>=16".
warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-syntax-flow@^7.14.5".
warning "react-scripts > eslint-config-react-app > eslint-plugin-flowtype@8.0.3" has unmet peer dependency "@babel/plugin-transform-react-jsx@^7.14.9".
warning "react-scripts > react-dev-utils > fork-ts-checker-webpack-plugin@6.5.2" has unmet peer dependency "typescript@>= 2.7".
warning "react-scripts > eslint-config-react-app > @typescript-eslint/eslint-plugin > tsutils@3.21.0" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
[4/4] Building fresh packages...
Done in 8.91s.

Commands to resolve the warnings:

yarn add '@types/react@>=16' '@babel/plugin-syntax-flow@^7.14.5' '@babel/plugin-transform-react-jsx@^7.14.9' 'typescript@>= 2.7' '@babel/core@^7.0.0-0' 'typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta'

You can now run rm -rf node_modules/ && yarn to test if the output is clean:

$ yarn
yarn install v1.22.15
[1/4] Resolving packages...
[2/4] Fetching packages...
info fsevents@2.3.2: The platform "linux" is incompatible with this module.
info "fsevents@2.3.2" is an optional dependency and failed compatibility check. Excluding it from installation.
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
Done in 9.05s.

Note that you may notice that you have to repeat this process if your newly added dependencies have any peer dependencies.

1
  • In the snippet where you recommend what to yarn add ... that includes many/all packages that should be yarn add -D ... instead.
    – adam2k
    Nov 22, 2022 at 20:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.