package.jsonで複数バージョンの同じライブラリを管理する方法MEMO

既存のコンポーネントはVue2を使いつつ、新規のコンポーネントはVu3を使いたいみたいなケースがあると思うんですが、そういう時にaliasを使用するといい感じに実現できそうだったのでメモ🗒

やり方

各種パッケージマネージャーのalias機能を使用します。 alias機能を使ったinstall方法はパッケージマネージャー毎に異なるので以下別セクションで公式ページから引用したものを記載しています。

インストールすると以下のような形で別名でpackageを管理することができます。

  "dependencies": {
    "vue": "^3.2.31",
    "vue-v2": "npm:vue@2.6.14"

実際に以下のような形でimportするpackageを切り替えることができます。

import { createApp } from "vue";
import Vue from "vue-v2";

Yarn

$ yarn add <alias-package>@npm:<package>

This will install a package under a custom alias. Aliasing, allows multiple versions of the same dependency to be installed, each referenced via the alias-package name given. yarn add | Yarn

npm

$ npm install <alias>@npm:<name>

Install a package under a custom alias. Allows multiple versions of a same-name package side-by-side npm-install | npm Docs

おわりに

段階的にバージョンを上げたりするときに便利ですね📦✨

参考

dev.to