新しいことにはウェルカム

技術 | 電子工作 | ガジェット | ゲーム のメモ書き

WSL に nvm で Node.js 環境を構築する

Pythonの環境構築と同様、WSLのUbuntuのバージョンを新しくしたので、Node.js環境を入れ直した時のメモです。

JavaScriptアプリを作った時期によって、使っているNode.jsのバージョンがまちまちなので、都度バージョンを切り替えられるよう、Node.jsバージョン管理ツール「nvm」を使ってNode.jsをインストールしてあります。

nvmとは?

Pythonのpyenvのようなもので、複数のバージョンのNode.jsをインストールして、任意にバージョンを切り替えることができます。

nvmの仕組み

pyenvと同様、$PATHが見に行く先を書き換えることにより、「node」と打った時に呼び出されるNode.jsのバージョンを切り替えます。

インストール手順

詳細は公式サイトを参照

下記を実行

curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.34.0/install.sh | bash

するとホームディレクトリに「.nvm」フォルダが作成され、「.bashrc」に下記が追記されます。

export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

WSLを立ち上げ直す

「.bashrc」が読み込まれて「nvm」が使えるようになります。

nvmを使ってNode.jsをインストールすると、バージョン毎にフォルダ分けされて「.nvm」配下にインストールされます。そして、nvmが状況に応じて$PATHの見に行く先を適当なバージョンのNode.jsに変えることによって、「node」と打った時に呼び出されるNode.jsのバージョンを変えています。

nvmの使用方法

インストールできるNode.jsのバージョン一覧表示

nvm ls-remote

指定したバージョンのNode.jsをインストール

例)バージョン10、8、6をインストール

nvm install 10
nvm install 8
nvm install 6

細かいバージョン番号は省略可能です。

インストールされているバージョン一覧表示

nvm ls

デフォルトのNode.jsバージョンを、指定したバージョンにする

例)デフォルトをバージョン10にする

nvm alias default 10

こうすると、WSLを立ち上げた時のバージョンが指定したものになります。

バージョンを切り替える

例)バージョン8に切り替える

nvm use 8

以降、Node.jsのバージョンが8になります。

バージョンをデフォルトに戻す

nvm use default

システムにインストールされているNode.jsを使う

バージョン名を「system」とすると、システムにインストールされているNode.jsになります。

例)システムのNode.jsをデフォルトとする

nvm alias default system

カレントディレクトリ以下でのNode.jsバージョンを、指定したバージョンにする

まず下記で「.nvmrc」ファイルに指定したいバージョンを記録しておきます。

例)バージョン6にする

echo "6" > .nvmrc

そうしておくと、「nvm use」と打つだけで、Node.jsのバージョンが「.nvmrc」に記載したものになります。

nvm use

アンインストール

nvm uninstall <バージョン>

その他

pyenvのように、ディレクトリに移動したら自動でNode.jsのバージョンが切り替わるような機能はなく、都度手動で「nvm use」して明示的に切り替える必要があります。

自動で切り替わるようなツールavnも紹介されていましたが、そこまではやらなくていいかなぁと思って使っていません。

結局TypeScriptをかませて使っているので、Node.jsのバージョン差をあまり意識したことはありませんが、メジャーバージョンアップの頻度が高過ぎるような気が…。

関連カテゴリー記事

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com

www.kwbtblog.com