こんにちは！JavaScriptの勉強をしているにゃっつです。
だいぶ空いてしまいましたが、Windowsにnodenvを導入する後編です。
前回はnodenvをインストールするための環境を構築、
WSLを使って、WindowsにLinuxの環境を構築しUbuntuをインストールしました。
今回はanyenvを通してnodenvをインストールします。
anyenvをとは
複数のプログラミング言語のバージョン管理システムを管理するツールです。
今回node.jsのバージョン管理をするために、nodenvを導入しますが、
他の言語にもバージョン管理システムがあります。
目次
anydevをインストール
「Ubuntu」を起動し、下記のコマンドを入力し、実行します。
git clone https://github.com/anyenv/anyenv ~/.anyenv
インストールが完了したら、
環境PATHを通すために使っているシェルを確認します。
下記のコマンドを実行します。
echo $SHELLシェルとは
ハードウェアとソフトウェアをつなぐプログラム「カーネル」を操作し結果を受け取るためのプログラム。
私が使っている環境は「Bourne Againシェル(bash)」だったので、
bashのコマンドを使っていきます。
anydevの環境PATHを通します。
PATHを通すとは、プログラム名だけで起動できるように、
あらかじめプログラムの実行ファイルのある場所を書いておくという事です。
echo 'export PATH="$HOME/.anyenv/bin:$PATH"' >> ~/.bash_profile環境PATHを設定する場所は、「.bash_profile」に設定します。
※ ここに記載することで、OSを再起動しても環境PATHの設定が保持されます。
環境PATHが通せたら、
シェルにanydevの設定を下記コマンドで行います。
echo 'eval "$(anyenv init -)"' >> ~/.bash_profileコマンドを実行後、設定を有効化するために、
下記コマンドでシェルを再起動します。
exec $SHELL -lこれでanydevのインストールから初期設定が完了しました。
anydevのバージョンを確認し、1.1.3-2(2021年6月時)であれば、
最新バージョンが無事インストールされています。
anydev -v
anydevの使い方は、コマンドを入力すると一覧で表示されます。
今回はnodenvをインストールするため、installコマンドを使用します。
anyenv installでinstallコマンドの一覧が表示されます。
anyenv install
nodenvをインストール
今回本題のnodenvをインストールしていきます。
下記コマンドを実行し、nodenvをインストールします。
anyenv install nodenvインストールが完了すると、再起動を要求されるので、再起動コマンドで再起動します。
nodenvもanydevと同じようにコマンド一覧を表示することができます。
nodenv
nodenv install
nodenvを通して、node.jsをインストール
nodenvをからnode.jsをインストールしていきます。
インストールする前に、公式サイトに行き、
現在の推奨版のバージョンを確認します。
推奨版は14.17.1だったため、14.17.1をインストールします。
nodenv install 14.17.1nodenv installだけではまだnode.jsを使うことはできないので、
インストールしたnode.jsを有効化していきます。
ここからがnodenvのいいところ、グローバルとローカルでバージョンを切り替えられるところになります。
グローバルで有効にしたい場合は下記コマンドを入力します。
nodenv global 14.17.1node.jsの設定を有効化するために、
一度シェルの再起動を行います。
exec $SHELL -l
これグローバルの設定が完了しまいた。node -v でnode.jsのバージョンを確認し、v14.17.1と表示されたら無事設定されています。
今度はプロジェクト毎にnode.jsの設定を行います。
testというフォルダを作り、ここに15.0.0のnode.jsを設定していきます。
まずは15.0.0のnode.jsをインストールします。
インストールが完了したら、
コマンドでtestのディレクトリに移動します。
testのディレクトリに移動できたことを確認したら、
ここで下記コマンドを実行します。
nodenv local 15.0.0node -v でnode.jsのバージョンを確認し、v15.0.0と表示されたらローカルに無事設定されています。
念のためglobalの設定が14.17.1のままかを確認します。
cdでホームディレクトに戻り、node -vでバージョンを確認します。
14.17.1であったため、無事バージョンを分けて設定することができました。
これで無事nodenvを使ってバージョン管理することができました。
VS Codeのプラグイン Remote – WSLで快適にバージョン管理
Windowsに無事nodenvをインストールし、バージョン管理をができるようになりました。
ただ今のままだと、バージョン管理をするためには、WSLの「Ubuntu」を起動して行う必要があります。
これをVS Codeのプラグイン Remote – WSLを入れることでVS Code上でバージョン管理をすることができます。
このプラグインはVS CodeからWSLにアクセスし、VS CodeとWSLをリモート接続した状態にします。
VS Codeのターミナルで入力したものがそのまま、WSLに反映されることになります。
Remote WSLは検索で探す、あるいは上の公式よりインストールすることができます。
Remote WSLの使い方
インストールが完了したら、下に
のマークがでてきるので、
こちらをクリックします。
クリック後どれに接続するか聞かれるので、「New WSL Window」をクリックして接続を開始します。
接続開始後、VS Codeが別ウィンドウで開かれ、WSLに接続します。
左下のオレンジ色の部分にWSL：Ubuntu-20.04と表示されたら、
接続完了です。
nodenvが使えるかどうか早速、ターミナルにコマンドを入力していきます。
現在グローバルで設定されているnode.jsのバージョンをnode -vで確認し、
違うバージョンに設定を変更してみます。
※ 事前にちがうバージョン14.17.0をインストールしておきました。
nodenv global 14.17.0設定後node -vでバージョン確認をし、先ほど設定した14.17.0に変更されたことが確認できました。
VS Codeでnodenvのコマンドを使用することができました。
node.jsの設定が完了したら、Remote -WSLを閉じます。
閉じるときは左下のオレンジの部分を再度クリックします。
クリック後起動時と同じような選択肢がでてくるので「リモート接続を終了する」をクリックします。
これで完了です。
まとめ
長くなりましたが、nodenvのインストールは以上となります。
もりけん塾の勉強会でnode.jsをバージョン管理する必要があること、
nodenvでプロジェクト毎にバージョン管理できる事を学びました。
Windowsでnodenvをインストールするのは、
一癖ありましたが、終わってみるとWindowsへの理解が少し深まった気がします。
まだnode.jsバージョン管理する制作をしていないので、
その高みにいけように精進していきます。
最後まで御覧頂きありがとうございました。
参考記事：
現在もりけん塾に参加し、JavaScriptの課題に取り組んでいます！
素敵な先生と塾生に囲まれて切磋琢磨な日々を送っています。
森田先生のBLOG：無骨日記
Twetter：@terrace_tech
