6

よく使用するコンポーネント用の React ライブラリを開発しています。私のルートフォルダには次のものがあります：

  • 私のロールアップ設定と私src/のライブラリを含む私のフォルダ。ビルドすると、バンドル ファイル (ES、CJS、および UMD) がdist/フォルダー内にあります。
  • 私のワークスペース:parcel独立したpackage.json. このpackage.jsonでは、myLib が依存関係にあり、リンクしています。

ワークスペースで myLib を使用する場合は、次のようにインポートしますimport { Button } from 'myLib'。

ここでは、すべて問題ないようです。しかし、コンポーネントでフックを使用していて、次のエラーが発生しました。

Uncaught Invariant Violation: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

React のコピーが 2 つあるようです。次のようにnpm ls react返されます。

└─┬ myLib@1.0.0 invalid
  └── react@16.8.6  extraneous

myLib/とworkspace/ node_modulesの間で react と react-dom をリンクしようとしましたが、うまくいきません。このエラーはまだここにあります。

TLDR;

これが私のファイルツリーです：

myLib
│   package.json
│   rollup.config.js
│
└───dist/
│
└───src/
│   │   **
│
└───workspace
│   │   package.json
│   │   index.js

myLib をワークスペースにリンクするには: I go to myLib/and I doyarn link次に I go to workspace/I doyarn link myLib

react および react-dom は、peerDependenciesmyLibおよびdevDependenciesです。workspace/

もちろん、私はすでにここを見ました：

4

3 に答える 3

1

私はここで私のために働いた答えを見つけました:開発中に Webpack で React が 2 回読み込まれるのを回避する方法

この問題に少し時間を費やしましたが、答えは簡単でした。複数のバージョンの React を使用している場合は、ワークスペースに移動し、myLib で React のバージョンにリンクする必要があります。

于 2019-11-19T03:50:27.493 に答える