reactで同じパッケージのバージョン違いを複数導入したいときの対応

同じパッケージだけど違うバージョンを使いたいときの対応です。

新バージョンでオミットされた旧機能を使いたいとか、今から作成するページだけ最新バージョンを使いたいときなど。

・・・需要あるか？？

バージョン違いを複数導入

npm@6.9.0から特定のパッケージ名で指定してインストールできるpackage aliasesが追加されました。

このpackage aliases機能を利用して複数インストールします。

npmバージョンの確認

# npm -v
6.12.0

npmアップデート

npmのバージョンが6.9.0以下ならアップデートしてください。

# npm i -g npm

バージョンアップできないなら、あきらめてください。

ローカルパッケージを自作して対応する方法もあるみたいです。

複数パッケージの導入

最新版の導入

通常のパッケージインストール時のコマンドです。

# npm i fusioncharts

aliases使用時の導入

package aliasesを利用したインストール方法です。

# npm i fusioncharts-3.12.2@npm:fusioncharts@3.12.2

[エイリアス名]@npm:[パッケージ]@[バージョン]

package.json

package.jsonは下記のようになります。

"dependencies": {
  "fusioncharts": "^3.18.0",
  "fusioncharts-3.12.2": "npm:fusioncharts@^3.12.2",
},

パッケージの使い分け

最新版を利用するとき

パッケージ名を指定してimportします。

import FusionCharts from "fusioncharts";

旧バージョンを使用するとき

エイリアス名を指定してimportします。

import FusionCharts from "fusioncharts-3.12.2";

まとめ

常に最新バージョンを使用できればあまり意味のない手順です。

今回はバージョンが上がった際に挙動が変わってしまって、どうしても旧バージョンが必要になったので対応しました。

本当は、清く諦めて、新しくなった挙動で解決策を見出すのが最善かもしれません。

世の中そんなに甘くないんだよな。

「新しい機能を使いたいけど、オミットされた旧機能も使いたい」なんて平気で要望出すんですよ。