[BUG] Shared dependencies installs multiple versions of React.
Nobody has claimed this yet.
- Dominant language
- JavaScript
- Stars
- 10.1k
- Forks
- 4.7k
- Avg merge
- 2d 2h
- Merged PRs (30d)
- 19
Description
Current Behavior:
We have multiple front ends using a shared component library (CL). The CL uses Storybook, with several add-ons in order to facilitate faster development. The CL has a peer dependency of ^17.0.0 || ^16.14.0 for backwards compatibility with a Storybook add-on. Our front ends also have a dependency (non-peer) on React ^17.0.1 || ^16.14.0 for backwards compatibility with the same storybook packages.
The front ends and CL are in two different workspaces.
When running npm i at the repo level (using workspaces for both the CL and the front-ends) React v16.14.0 is installed at the repo level, and React 17.0.1 is installed in the front-end node_modules. This appears to all be fine - until running the front-end locally, which then results in hook errors being thrown because multiple versions of react are installed:
Edit: I set the front-end to have a specific dependency on 16.14.0 and it still installs a separate version in the front-end\node_modules directory, and so we still get the same hook errors because despite matching versions with the hoisted version - it is still a separate installation.
\root
package.json (defines workspaces for \component-library and \front-ends)
\node_modules
\react (16.14
\component-library
package.json (defines peerDep on react "17 || 16.14", and on storybook - which is dependent on react >=16 based on @emotion/core)
\front-ends
\someFrontEnd
package.json (defines dependency on React "17 || 16.14.0" AND component-library)
\nodu_modules
\react (17.0.1)
Expected Behavior:
Install the 'lowest common denominator' that matches all packages' dependencies.
Environment:
- OS: Win 10
- Node: 15,12
- npm: 7.6.3
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the root package.json workspace definition, then inspect component-library/package.json and someFrontEnd/package.json. Reproduce npm i with the reported Node and npm versions and compare the root and front-end node_modules trees. Done means compatible workspaces resolve to one usable React installation without the reported hook errors.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, nodejs
- Domain
- build-system, tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 28/100