はじめに
npm install でこんなエラーに遭遇したことはないでしょうか。
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: react@18.1.0
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^0.14 || ^15.5.4 || ^16.1.1" from react-dates@21.8.0
この peer という単語、なんとなく読み飛ばしていませんか？この記事では、エラーの中に出てくる peer dependency（ピア依存） の考え方をやさしく整理します。
問題
上のエラーは、依存関係の解決に失敗したこと（ERESOLVE）を示しています。ポイントを分解するとこうなります。
-
Found: react@18.1.0… 現在プロジェクトに入っている React のバージョン -
peer react@"^0.14 || ^15.5.4 || ^16.1.1" from react-dates…react-datesが要求する対応バージョン
つまり React 18 が入っているのに、react-dates は React 16 までしか対応していない という矛盾が原因です。
ここで出てくるのが peer というキーワードです。この意味を知らないと、なぜ矛盾が起きるのかがピンと来ません。
解決方法
peer dependency（ピア依存）とは
peer dependency とは、あるパッケージが「利用側（ホスト）にこのバージョンを用意してね」と要求する依存関係 のことです。
通常の依存（dependencies）と違い、ピア依存のパッケージは 自分自身ではそのパッケージをインストールしません。ホスト側にインストールされている同一パッケージを 共有する前提 で動きます。
先ほどの例に当てはめると、次のようになります。
- 「自分」＝インストール対象のパッケージ（
react-dates） -
react-datesは React を自分で抱え込まず、あなたのプロジェクトに入っている React を使う前提 にしている
言い換えると、こういう関係です。
インストール対象のパッケージは、ホスト側（あなたのプロジェクト）に必要な別パッケージが入っている前提とし、自分では抱え込まない
なぜこの仕組みがあるのか（メリット）
ピア依存には、大きく2つのメリットがあります。
1. 容量が軽くなる
もし各パッケージが個別に React を抱え込むと、node_modules/react-dates/node_modules/react のように React が重複してインストールされてしまいます。ピア依存にすることで、ホスト側の React を1つだけ共有すればよくなり、重複が減って全体の容量が軽くなります。
2. バージョンが1つに統一される
React のような UI ライブラリは、アプリ全体で 実体が1つ であることが重要です。複数の React が混在すると、内部状態を管理する仕組みが噛み合わず不具合が起きます。ピア依存でホスト側の React に一本化することで、バージョン不一致による不具合を防げます。
だからエラーになる
このメリットの裏返しが、冒頭のエラーです。ピア依存は「ホスト側のバージョンを使う」前提なので、ホスト側のバージョンが対応範囲外だと矛盾が表面化 します。React 18 を入れているのに react-dates の対応上限が React 16 だったため、npm が「解決できない」と止まったわけです。
おわりに
peer dependency は、パッケージ同士でライブラリの実体を共有するための仕組みでした。ポイントを一言でまとめると次の通りです。
- ピア依存 = インストール対象パッケージが、ホスト側に必要な別パッケージが入っている前提とし、自分では抱え込まない依存
- メリットは「容量削減」と「バージョン統一」
- 逆にホスト側が対応範囲外だと
ERESOLVEエラーになる
エラーメッセージの peer の意味がわかると、依存関係の矛盾がぐっと読み解きやすくなります。
参考
- npm Docs: peerDependencies
- npm Docs: ERESOLVE エラーの解説
JISOUのメンバー募集中！
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか？
興味のある方は、ぜひホームページをのぞいてみてください！
▼▼▼
https://projisou.jp