pnpm: missing peer dependencies after installation of pnpm v6.24.4

pnpm version:

6.24.4

Code to reproduce the issue:

pnpm add [npm package] eg pnpm add lauqe

Expected behavior:

Downloading registry.npmjs.org/devextreme-angular/21.2.4: 8.39 MB/8.39 MB, done
Packages: +3
+++
Progress: resolved 2322, reused 2261, downloaded 10, added 3, done

dependencies:
+ lauqe 1.5.0

Actual behavior:

pnpm add lauqe
Downloading registry.npmjs.org/devextreme-angular/21.2.4: 8.39 MB/8.39 MB, done
Packages: +3
+++
Progress: resolved 2322, reused 2261, downloaded 10, added 3, done

dependencies:
+ lauqe 1.5.0

 WARN  Issues with peer dependencies found
.
├─┬ @nrwl/cypress
│ ├─┬ @cypress/webpack-preprocessor
│ │ ├── ✕ missing peer @babel/core@^7.0.1
│ │ ├── ✕ missing peer @babel/preset-env@^7.0.0
│ │ ├── ✕ missing peer babel-loader@^8.0.2
│ │ └── ✕ missing peer webpack@"^4 || ^5"
│ └─┬ ts-loader
│   └── ✕ missing peer webpack@^5.0.0
├─┬ @storybook/addon-essentials
│ ├── ✕ missing peer @babel/core@^7.9.6
│ ├── ✕ missing peer babel-loader@^8.0.0
│ ├── ✕ missing peer webpack@"*"
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @storybook/addon-controls
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @storybook/addon-measure
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @storybook/addon-outline
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @storybook/addon-toolbars
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ └─┬ @storybook/addon-viewport
│   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│   └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/angular
│ ├── ✕ missing peer @babel/core@"*"
│ ├── ✕ missing peer @angular-devkit/architect@>=0.8.9
│ └── ✕ missing peer @angular-devkit/core@"^0.6.1 || >=7.0.0"
├─┬ jest-preset-angular
│ └─┬ ts-jest
│   ├── ✕ missing peer @babel/core@">=7.0.0-beta.0 <8"
│   └── ✕ unmet peer esbuild@~0.14.0: found 0.13.13 in jest-preset-angular
├─┬ ts-jest
│ └── ✕ missing peer @babel/core@">=7.0.0-beta.0 <8"
├─┬ @storybook/addon-docs
│ ├── ✕ missing peer webpack@"*"
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer vue@"^2.6.10 || ^3.0.0"
│ ├─┬ @storybook/core
│ │ ├── ✕ missing peer webpack@"*"
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ ├─┬ @storybook/core-client
│ │ │ ├── ✕ missing peer webpack@"*"
│ │ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ └─┬ @storybook/core-server
│ │   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │   ├─┬ @storybook/core-client
│ │   │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │   └─┬ @storybook/manager-webpack4
│ │     ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │     ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │     └─┬ @storybook/core-client
│ │       ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │       └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @mdx-js/loader
│ │ └─┬ @mdx-js/react
│ │   └── ✕ missing peer react@"^16.13.1 || ^17.0.0"
│ ├─┬ @storybook/builder-webpack4
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ ├─┬ @storybook/client-api
│ │ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ │ └─┬ @storybook/store
│ │ │   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ │   └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ ├─┬ @storybook/core-common
│ │ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ ├─┬ @storybook/preview-web
│ │ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ ├─┬ @storybook/ui
│ │ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ │ ├─┬ downshift
│ │ │ │ └── ✕ missing peer react@>=16.12.0
│ │ │ ├─┬ react-draggable
│ │ │ │ ├── ✕ missing peer react@">= 16.3.0"
│ │ │ │ └── ✕ missing peer react-dom@">= 16.3.0"
│ │ │ └─┬ react-helmet-async
│ │ │   ├── ✕ missing peer react@"^16.6.0 || ^17.0.0"
│ │ │   └── ✕ missing peer react-dom@"^16.6.0 || ^17.0.0"
│ │ └─┬ terser-webpack-plugin
│ │   └─┬ terser
│ │     └── ✕ unmet peer acorn@^8.5.0: found 7.4.1
│ ├─┬ @storybook/source-loader
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ └─┬ react-element-to-jsx-string
│   ├── ✕ missing peer react@"^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1"
│   └── ✕ missing peer react-dom@"^0.14.8 || ^15.0.1 || ^16.0.0 || ^17.0.1"
├─┬ @angular/fire
│ ├── ✕ missing peer firebase@^9.4.0
│ ├── ✕ missing peer rxfire@^6.0.0
│ └─┬ file-loader
│   └── ✕ missing peer webpack@"^4.0.0 || ^5.0.0"
├─┬ @storybook/addon-actions
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @storybook/addons
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ └─┬ @storybook/api
│ │   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │   ├─┬ @storybook/router
│ │   │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │   │ ├─┬ react-router
│ │   │ │ └── ✕ missing peer react@>=16.8
│ │   │ └─┬ react-router-dom
│ │   │   ├── ✕ missing peer react@>=16.8
│ │   │   └── ✕ missing peer react-dom@>=16.8
│ │   └─┬ @storybook/theming
│ │     ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │     ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │     ├─┬ @emotion/core
│ │     │ └── ✕ missing peer react@>=16.3.0
│ │     ├─┬ @emotion/styled
│ │     │ ├── ✕ missing peer react@>=16.3.0
│ │     │ └─┬ @emotion/styled-base
│ │     │   └── ✕ missing peer react@>=16.3.0
│ │     └─┬ emotion-theming
│ │       └── ✕ missing peer react@>=16.3.0
│ ├─┬ @storybook/components
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ ├─┬ markdown-to-jsx
│ │ │ └── ✕ missing peer react@">= 0.14.0"
│ │ ├─┬ react-colorful
│ │ │ ├── ✕ missing peer react@>=16.8.0
│ │ │ └── ✕ missing peer react-dom@>=16.8.0
│ │ ├─┬ react-popper-tooltip
│ │ │ ├── ✕ missing peer react@"^16.6.0 || ^17.0.0"
│ │ │ ├── ✕ missing peer react-dom@"^16.6.0 || ^17.0.0"
│ │ │ └─┬ react-popper
│ │ │   └── ✕ missing peer react@"^16.8.0 || ^17"
│ │ ├─┬ react-syntax-highlighter
│ │ │ └── ✕ missing peer react@">= 0.14.0"
│ │ └─┬ react-textarea-autosize
│ │   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   ├─┬ use-composed-ref
│ │   │ └── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   └─┬ use-latest
│ │     ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │     └─┬ use-isomorphic-layout-effect
│ │       └── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ └─┬ react-inspector
│   └── ✕ missing peer react@"^16.8.4 || ^17.0.0"
├─┬ @storybook/addon-backgrounds
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/addon-cssresources
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ ├─┬ @storybook/addons
│ │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │ └─┬ @storybook/api
│ │   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │   ├─┬ @reach/router
│ │   │ ├── ✕ missing peer react@"15.x || 16.x || 16.4.0-alpha.0911da3"
│ │   │ ├── ✕ missing peer react-dom@"15.x || 16.x || 16.4.0-alpha.0911da3"
│ │   │ └─┬ create-react-context
│ │   │   └── ✕ missing peer react@"^0.14.0 || ^15.0.0 || ^16.0.0"
│ │   ├─┬ @storybook/router
│ │   │ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │   │ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ │   └─┬ @storybook/theming
│ │     ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ │     └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ └─┬ @storybook/components
│   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│   └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/addon-design-assets
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ └─┬ use-image
│   ├── ✕ missing peer react@"^16.8.0 || ^17"
│   └── ✕ missing peer react-dom@"^16.8.0 || ^17"
├─┬ @storybook/addon-events
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ └─┬ @storybook/client-api
│   ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│   └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/addon-google-analytics
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ ├── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
│ └─┬ react-ga
│   ├── ✕ missing peer react@"^15.6.2 || ^16.0"
│   └── ✕ missing peer prop-types@^15.6.0
├─┬ @storybook/addon-jest
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/addon-links
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/addon-queryparams
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ @storybook/addon-storysource
│ ├── ✕ missing peer react@"^16.8.0 || ^17.0.0"
│ └── ✕ missing peer react-dom@"^16.8.0 || ^17.0.0"
├─┬ devextreme
│ └─┬ @devextreme/runtime
│   ├── ✕ missing peer vue@^2.6.14
│   └── ✕ unmet peer @angular/core@^11.0.4: found 13.1.1
├─┬ devextreme-themebuilder
│ └─┬ bootstrap
│   ├── ✕ missing peer jquery@"1.9.1 - 3"
│   ├── ✕ missing peer popper.js@^1.16.1
│   └── ✕ missing peer @popperjs/core@^2.10.2
├─┬ @nrwl/eslint-plugin-nx
│ └── ✕ unmet peer @typescript-eslint/parser@~5.3.0: found 5.8.1
├─┬ @activejs/core
│ └── ✕ unmet peer rxjs@^6.0.0: found 7.5.1
├─┬ @nrwl/angular
│ ├─┬ jasmine-marbles
│ │ └── ✕ unmet peer rxjs@^6.5.3: found 7.5.1
│ └─┬ rxjs-for-await
│   └── ✕ unmet peer rxjs@^6.0.0: found 7.5.1
├─┬ ngx-auto-unsubscribe-decorator
│ └── ✕ unmet peer rxjs@0.0.0-RXJS: found 7.5.1
├─┬ rxjs-boost
│ └── ✕ unmet peer rxjs@^6.6.0: found 7.5.1
├─┬ @uiowa/digit-only
│ ├── ✕ unmet peer @angular/common@^12.0.0: found 13.1.1
│ └── ✕ unmet peer @angular/core@^12.0.0: found 13.1.1
├─┬ angular-svg-icon-preloader
│ ├── ✕ unmet peer @angular/common@^12.0.0: found 13.1.1
│ ├── ✕ unmet peer @angular/core@^12.0.0: found 13.1.1
│ └── ✕ unmet peer angular-svg-icon@^12.0.0: found 13.0.0
├─┬ file-saver-angular
│ ├── ✕ unmet peer @angular/common@^9.1.13: found 13.1.1
│ └── ✕ unmet peer @angular/core@^9.1.13: found 13.1.1
├─┬ ng-svg-icon-sprite
│ ├── ✕ unmet peer @angular/common@^11.0.0: found 13.1.1
│ └── ✕ unmet peer @angular/core@^11.0.0: found 13.1.1
├─┬ ngx-lazy-image
│ ├── ✕ unmet peer @angular/common@"^6.0.0-rc.0 || ^6.0.0": found 13.1.1
│ └── ✕ unmet peer @angular/core@"^6.0.0-rc.0 || ^6.0.0": found 13.1.1
└─┬ ngx-teleport
  ├── ✕ unmet peer @angular/common@^11.2.12: found 13.1.1
  └── ✕ unmet peer @angular/core@^11.2.12: found 13.1.1
Peer dependencies that should be installed:
  @angular-devkit/architect@>=0.8.9         popper.js@^1.16.1                         
  @angular-devkit/core@"^0.6.1 || >=7.0.0"  prop-types@^15.6.0                        
  @babel/core@">=7.9.6 <8.0.0"              react-dom@">=16.8.0 <17.0.0"              
  @babel/preset-env@^7.0.0                  react@">=16.13.1 <17.0.0"                 
  @popperjs/core@^2.10.2                    rxfire@^6.0.0                             
  babel-loader@">=8.0.2 <9.0.0"             vue@">=2.6.14 <3.0.0"                     
  firebase@^9.4.0                           webpack@">=5.0.0 <6.0.0"                  
  jquery@"1.9.1 - 3"

Additional information:

node -v prints: 16.13.0
Windows, macOS, or Linux?: Linux Mint

The application installation completes normally.

About this issue

Original URL
State: closed
Created 2 years ago
Reactions: 4
Comments: 21 (11 by maintainers)

Commits related to this issue

feat: support peerDependencyRules for muting peer dep issues close #4183 — committed to pnpm/pnpm by zkochan 2 years ago
feat: support peerDependencyRules for muting peer dep issues (#4212) close #4183 — committed to pnpm/pnpm by zkochan 2 years ago

Most upvoted comments

Install the missing peer dependencies. The list is even printed. You can copy the list from the Peer dependencies that should be installed: section and put it to the pnpm add command

pnpm add   @angular-devkit/architect@>=0.8.9  popper.js@^1.16.1    @angular-devkit/core@"^0.6.1 || >=7.0.0"  prop-types@^15.6.0   @babel/core@">=7.9.6 <8.0.0"      react-dom@">=16.8.0 <17.0.0"                @babel/preset-env@^7.0.0                  react@">=16.13.1 <17.0.0"     @popperjs/core@^2.10.2    rxfire@^6.0.0      babel-loader@">=8.0.2 <9.0.0"             vue@">=2.6.14 <3.0.0"       firebase@^9.4.0                webpack@">=5.0.0 <6.0.0"          jquery@"1.9.1 - 3"

+71

zkochan on Jan 4, 2022

First I think most people don’t know what peerDependency means. Like @zynth17 said

this doesn’t resolve the issues because it forces us to install something that we doesn’t actually use like @st-clair-clarke said. in my case i use vue 3 but error said i need to install vue 2.

and @st-clair-clarke said

I avoid jquery. I don’t use react or babel or vue. Yet I have to install these!

Actually, peerDependency is required from dependency you have already installed, but it requires some more dependencies installed above itself in the dependency tree.

For example, if you install pkgA, and pkgA has a peerDependency pkgB. This means you have to manually install pkgB too in order to make pkgA work properly.

Back to this issue, what @zkochan done in recent pnpm update is making peerDependency warnings more clear and detailed, thus users start feeling this comes up from nowhere but in fact this warning actually has been printing out with limited line for a long time.

As for warning in human words, you are using pkgA, and pkgA tells package manager that pkgA should be use together with pkgB@x (with declaring a peerDependency pkgB@x). Thus pnpm warns that out.

If your project works fine with these warnings, this means you may in following lucky conditions

unmet peer shows up but project works. The declared peerDependency is installed but installed version doesn’t match declared version, but luckily the installed version doesn’t have break changes which would break the package declared peerDependency.
missing peer shows up but project works.
- your project is just using part of your dependency which doesn’t require its peerDependency.
- your environment have these peerDependency installed globally because node will look up dependency all the way to root (but pnpm don’t know about it).
- …

Preferably those warning should be solved by dependency update, add missing ones, or package owner writes correct peerDependencies. In this way, you have a certainty of your project’s dependency and higher quality.

And for new settings, ignoreMissing LGTM, but for allowedVersions, I think packageExtensions already covers it?

+43

m1heng on Jan 9, 2022

also got the same issues

+26

hi-reeve on Jan 4, 2022

We can add a new setting to the pnpm section in package.json in order to control what peer dependency issues are OK. Something like this:

{
  "pnpm": {
    "peerDependencyRules": {
      "ignoreMissing": ["babel-loader"],
      "allowedVersions": {
        "@angular/common": "13"
      }
    }
  }
}

cc @pnpm/collaborators

+13

zkochan on Jan 8, 2022

I don’t think we have much choice as these are fields that are already implemented in both or one of npm/Yarn. peerDependenciesMeta is supported by all three package managers. packageExtensions we implemented the same way as it works in Yarn. overrides is similar to npm’s overrides but only partially. Actually there is an issue that asks us to support the same “overrides” syntax that is supported by npm.

zkochan on Jan 9, 2022

I agree with your suggestion @zkochan that a setting is needed to control what peer dependencies should be ignored. The suggested solution using .pnpmfile.cjs again forces us to manually add a list of if statements. I corrected the peer dependencies initially flagged, BUT others now appear with warnings, requesting that I even downgrade my typescript and @angular/* packages that are current!

This is a real issue. Hope we can resolve it.

I am still wondering the reason why these console output started. I have never seen any such in pnpm before my upgrade.

st-clair-clarke on Jan 6, 2022

Fix using .npmrc file auto-install-peers=true https://www.youtube.com/shorts/ryk1XmaBGsg?feature=share

claudemyburgh on Aug 9, 2023

isn’t ignoreMissing is already covered by

no, peerDependenciesMeta is only applied to the peer dependencies of the current package.

allowedVersions, I think packageExtensions already covers it?

No, packageExtensions may only add new fields to peerDependencies but no override existing fields.

Oh sorry, I missed it. In this case, adding peerDependencyRules would be necessary. But I just want to raise a point, maybe we want to make pacakge.json -> pnpm.xxx well organized.

m1heng on Jan 9, 2022

Might be a terminal issue. Try pnpm add --save-peer "prop-types@^15.6.0"

zkochan on Jan 4, 2022

The only thing that has changed is that we print this warnings in a hierarchical view. In the past these warnings were printed as plain test and when there were many issues, we only printed the first 5 or so.

zkochan on Jan 4, 2022