3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

[Windows・Mac両対応]Node.jsのバージョン管理をVoltaに任せ、プロジェクトごとに自動で切り替える方法

Last updated at Posted at 2022-10-29

新規プロジェクトを始めた際、Node.jsのバージョン管理にVoltaを採用しました。
実際に導入してみて使い勝手がよかったので、導入の背景も含めて紹介しようと思います。
インストール方法・使い方をだけ知りたい場合はこちらを参照ください。

Volta公式:https://volta.sh/

導入の背景

単体のプロジェクトであればバージョン管理の必要性はほぼないのですが、以下の理由でバージョン管理を検討することにしました。

複数のプロジェクトをまたぐ

現在、私の参画している開発現場ではNode.jsを使用しているプロジェクトが複数あり、Node.jsのバージョンは各プロジェクトごと管理している状態です。
また、普段は担当しているプロジェクトで開発を行うのですが、必要に応じて別のプロジェクトに社内出張する場合もあります(実際にしました)
開発メンバーがプロジェクトを横断した際、Node.jsのバージョンが違えば再インストールが必要になってしまいます。

開発体験の向上

プロジェクトによっては開発用のDockerファイルが用意されており、Node.jsのバージョンを気にしないで開発することができます。
ただ、出張先プロジェクトの開発用Dockerが起動しなかったことがありました。
聞いてみると、全員ローカルで開発している状況で、Dockerファイルが保守されていませんでした。
また、Dockerコンテナ内にnode_modulesディレクトリがあるとローカルでは参照できません。これはつまり、VSCodeなどのIDEでディレクトリを開いてもimport文などがエラーになることを意味します。
Dockerコンテナにリモート接続して開発すれば解決する問題なのですが、リモート接続すると動きがもっさりしており、ファイルの保存をするのに1~2秒くらいかかるということもしばしば。
Dockerがあっても開発体験が悪く、結局ローカルで動かすかIDEのエラーを無視して開発していました。

開発者以外の負荷軽減

棚ぼた的な副産物だったのですが、開発者以外の負担軽減になるのではと思います。
具体例で行くとデザインチームの環境構築で力を発揮したと思います。
デザイナーさんにHTMLやCSSの調整をしていただいていますが、複数のプロジェクトを横断しておりNode.jsのバージョン切り替えが必要になるのは目に見えていました。
Node.jsのバージョンは開発者の責任範囲で、デザインチームは気にしないで開発をしてほしいという思いがあります。
Voltaを使用すれば各プロジェクトでNode.jsバージョンを気にしなくて済むので負荷が軽減されると思います。
また、開発者に対しても含め、初期構築にかける時間をできるだけ削減したいという思いもありました。

他ツールとの比較

Volta以外にもNode.jsのバージョン管理ができるツールが存在するため、以下のツールと比較・検討しました。
採用しなかった理由も添えてご紹介します。

なお、Googleトレンドは以下のようになっていました。

image.png

nodenvよりもVoltaの方が検索数が多いのは意外でした。

nodenv

公式:https://github.com/nodenv/nodenv

「nodejs バージョン 切り替え」「nodejs バージョン管理」で調べると一番上に出てきました。
かなりメジャーなようです。
ただ、こちらWindowsでは使用できないそうです。
Windowsでも開発をしている人がいるため採用を見送りました。

nodist

公式:https://github.com/nullivex/nodist

「nodejs バージョン管理 windows」で調べると出てきました。
nodenvと互換性を持っているみたいで、nodenvのWindows版ととらえていいのかなと。
ただ、最終更新が2019年で止まっているのと、MacとWindowsでインストールするソフトが違うのも避けたかったのでこちらも採用を見送りました。

Docker

Dockerで解決するならこれに越したことはないです。
ただ、開発体験の向上にも書いたのですが開発体験が非常に悪いです。また、Dockerファイルの保守も必要になります。
毎日ストレスを感じながら開発するくらいなら使わない方がいいと判断し、今回は採用を見送りました。
開発体験が向上したら再度検討すると思います。

インストール方法

公式:https://docs.volta.sh/guide/getting-started

[必須]Node.jsの削除

ローカル環境にNode.jsが存在する場合は一度アンインストールしてください。

Windows

インストローラーがあります。
Windows Installationdownload and run the Windows installerをクリックするとインストローラーがダウンロードされるので実行してください。

image.png

Mac・Linux

Unix Installationに記述してあります。

curl https://get.volta.sh | bash

でインストールできるようです。

使い方

指定のバージョンをインストールする

公式:https://docs.volta.sh/reference/install

Node.jsの指定のバージョンをインストールするには以下のコマンドを実行します。

LTS
$ volta install node
特定バージョンの安定板
volta install node@16
最新バージョン
volta install node@latest
詳細
volta install node@14.20.1

yarnをインストールする

「指定のバージョンをインストールする」と一緒です。

yarnインストール
volta install yarn@latest

バージョン切り替え

「指定のバージョンをインストールする」と一緒です。

インストール=バージョン切り替え
volta install node@14.20.1
# => success: installed and set node@14.20.1 (with npm@6.14.17) as default

image.png

現在のNode.jsのバージョンを確認する

バージョン確認
node -v # => v16.16.0

Voltaで使用しているデフォルトのNode.jsバージョンが以下のコマンドです。

voltaで指定しているNode.jsバージョン確認
volta list

image.png

プロジェクトごとの自動切り替え

volatの特に気に入っている部分は、プロジェクトごとにnode.jsのバージョンを指定でき、かつ自動的に切り替わることだと思います。

設定方法

プロジェクトで使用するnode.jsを指定は、以下の手順を行うことで設定することができます。

package.jsonがあるディレクトリで以下のコマンドを入力します。
@の後はnode.jsのバージョンを指定してください

volat pin node@16

すると、package.jsonvoltaの項目が増えます。

package.json
{
  "name": "node16",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "volta": {
    "node": "16.18.0"
  }
}

success: pinned node@16.18.0 (with npm@8.19.2) in package.jsonと出力されていれば完了です。
yarnやnpmのバージョンを指定することもできます。

自動で切り替わるか確認する

node.jsのバージョン14と16それぞれ使用するプロジェクトを作成し、本当に自動的に切り替わっているのか確認してみます。

voltaの設定とnode.jsのバージョンを確認してみます。

image.png

そのままバージョン16使用しているをディレクトリに移動し、同じようにvoltaの設定とnode.jsのバージョンを確認してみます。

image.png

途中で操作する必要なく、node.jsのバージョンが自動で切り替わりました!

課題・感想

いかがでしたでしょうか。
node.jsのバージョンを切り替えることなく自動でプロジェクトに合わせてくれるのはとてもありがたいです。また、windowsとmacで同じソフトを使用できるのもメリットだと思います。

課題としては、既存のプロジェクトにもvoltaのバージョン指定の設定を入れる必要があることです。
結局1つだけのプロジェクトで入れている状態だと、別プロジェクトに移動した際にバージョンを指定しなければいけなくなってしまうので。

とはいえ、先駆けとして入れてみたのは正解だったと思います。
周りの反応もうかがいながら、別プロジェクトへの導入も提案していければと思います!

参考資料

3
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?