How can resolve path webpack with yarn workspace

user_6671272 0
Viewed 477
  • node_modules
    • react
    • react-dom
    • extenal-react-library
  • packages
    • A
      • node_modules
        • react
        • react-dom
      • package.json
    • B
    • C
  • package.json

A

//package.json
"dependencies": {
  "react": "~16.8.6"
  "react-dom": ~16.8.6 
}

root package.json

//package.json
"dependencies": {
  "react": "^16.8.1",
  "react-dom": "^16.8.1",
  "extenal-react-library": "1.0.0"
}

extenal-react-library package.json

"peerDependencies": {
  "react": "~16.8.6"
  "react-dom": ~16.8.6 
}

in A packages component, i use extenal-react-library import { Button } from 'extenal-react-library' but, invalid hook call warning https://reactjs.org/warnings/invalid-hook-call-warning.html

because import React from 'react' in extenal-react-library/Button it use in root node_modules/react not A/node_modules/react

Specifically, this only happens on ssr.

help me plz..

webpack reactjs javascript
1 Answers

It's a well known issue in yarn@1. In yarn@2, this won't happen, but only if you configure it right, as pointed out by the author in this long thread discussing this very bug.

A quick-fix however is to just add react and react-dom as dependencies to the root as well (or any other package), because yarn will only hoist dependencies to the root, if more than one project use it.

user_22287710
Related