New Override feature not working for nested peer dependencies?

[iyobo]

With npm@8 came the ability to define overrides in our package.json which we use to override (i.e force) what version of a dependency our app or our app's dependencies use. i.e:

// package.json

"overrides":{
   "react": "17.0.2",
}

The documentation for package.json's override implies that we can do this to override a specific dep's nested dep version.

// package.json

"overrides":{
   "some-old-dep":{
       "react": "17.0.2",
   }
}

Unfortunately, the above does not work if nested dep i.e react is specified as a peer dependency in some-old-dep with a different version.
npm i gives:

Could not resolve dependency:
npm ERR! peer react@"^15.3.0 || ^16.2.0" from some-old-dep@1.0.0

It seems that from the documentation of the npm@8 "overrides" feature, this should be very possible.
If not, then it would really complete this override feature to allow for this.

[darcyclarke]

Can you file this as an bug using our issue template here: https://github.com/npm/cli/issues/new?assignees=&labels=Bug%2CNeeds+Triage%2CRelease+8.x&template=bug_8.yml&title=%5BBUG%5D+%3Ctitle%3E

[Tofandel]

Is there a link to the issue? I'm also facing the same problem..

[davidgoli]

This worked for me

#552 (comment)

[induratized]

@iyobo Was the bug filed ?

I recently face this issue with react-lottie package. My root project uses react^17.02 as dep, whereas react-lottie has peerDep to react at max ^16.0.0.

Even I tried solution at https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides mentioned in issue

Below is the error

npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: react-top-loading-bar@2.0.1
npm ERR! Found: react@17.0.2
npm ERR! node_modules/react
npm ERR!   react@"^17.0.1" from the root project
npm ERR!   peer react@"^16.8.0 || ^17.0.0" from @material-ui/core@4.11.4
npm ERR!   node_modules/@material-ui/core
npm ERR!     @material-ui/core@"^4.11.3" from the root project
npm ERR!     peer @material-ui/core@"^4.0.0" from @material-ui/icons@4.11.2
npm ERR!     node_modules/@material-ui/icons
npm ERR!       @material-ui/icons@"^4.11.2" from the root project
npm ERR!       1 more (react-material-ui-carousel)
npm ERR!     1 more (react-material-ui-carousel)
npm ERR!   17 more (@material-ui/icons, @material-ui/styles, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.0.0" from react-top-loading-bar@2.0.1
npm ERR! node_modules/react-top-loading-bar
npm ERR!   react-top-loading-bar@"^2.0.1" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: react@16.14.0
npm ERR! node_modules/react
npm ERR!   peer react@"^16.0.0" from react-top-loading-bar@2.0.1
npm ERR!   node_modules/react-top-loading-bar
npm ERR!     react-top-loading-bar@"^2.0.1" from the root project

[sungsong88]

I have the same issue.

[diegof29]

@induratized do you have a monorepo with workspaces? If that's the case, then you need to put the overrides rules inside the root package.json otherwise the overrides are ignored, as mentioned here