【もりけん塾・勉強会】nodenvの環境構築をやってみた

JavaScript

今日は、もりけん塾で勉強会のあったnodenvの環境構築についてです。

こんにちは。Webコーダーのはるです。

所属している「もりけん塾」のnodenv勉強会をやっと追うことができたのでアウトプットします。

【もりけん塾・勉強会】nodenvの環境構築をしてみた

勉強会に出席できなかったので、もりけん先生が作ってくださったハンズオン資料を見て進めました。

handsonFrontend/node/nodenv.md at master · kenmori/handsonFrontend
フロントエンドエンジニアを目指す方へのハンズオン資料. Contribute to kenmori/handsonFrontend development by creating an account on GitHub.
github.com

ハンズオンで紹介されていた記事も参考にしました。

nodenvの環境構築 - Qiita
この記事では個人的にお勧めなnodenvのインストール方法と使い方について簡単に紹介していきたいと思います。anyenvを使ったインストール方法も別の記事で紹介していますので、こちらも参考にしてい…
qiita.com

nodenvとは何か

Node.jsのバージョンを自動で切り替えてくれるツール。

先生のハンズオンには、

フロントエンド開発ではnodeバージョンがプロジェクトごとに変わっていると頻繁に手動で変えなくてはならない or バージョン管理をしなくてはならない

nodenvはそれを自動的に切り替えてくれる便利なもの & 流行り出している & 乗り換える人が多くなってきているのでお勧めしている

と書かれていました。知らないことばかりです。

プロジェクトごとにnodeのバージョンを自動で切り替えてくれるのはとても便利！

早速、導入していきます。

nodenvをインストールする

nodenvをgit cloneします。(GitHubより)

git clone git://github.com/nodenv/nodenv.git ~/.nodenv

無事に完了しました。

実行可能な状態にする

ビルドするというそうです。ターミナルで以下を入力しました。

cd ~/.nodenv && src/configure && make -C src

PATHを通す

コマンドが使用できるようにPATHを通します。

echo 'export PATH="$HOME/.nodenv/bin:$PATH"' >> ~/.zshrc
echo 'eval "$(nodenv init -)"' >> ~/.zshrc

「PATHを通す」の意味が自分の中で曖昧だったので調べました。参考リンクによると、

実行ファイルを（ファイルが置いてある場所を指定しないで）ファイル名を指定するだけで実行できるようにする

と書かれていました。

コマンドの実行ファイルの場所を環境変数$PATHに追加しておくことで、シェルがファイルの場所を把握して、パスがなくてもファイル名だけでコマンドを実行できるようになるとのこと。

とにかく新しいコマンドを使用するためにPATHを通すのですね（こちらもわかりやすかった）

以下のコマンドで、環境変数＄PATHに追加されているものを確認することができます。

echo $PATH

※ここで出てきた記載順が、コマンド実行の優先順位となる。

初期化、シェルの再起動

nodenv初期化

~/.nodenv/bin/nodenv init

シェルの再起動・・・これで新しいPATHの設定ファイルを反映させる

exec $SHELL -l

正しくインストールされたか確認

nodenvが正しくインストールされたか確認します。

nodenv --version

以下のように何かしらバージョンが出てくればOKです。

プラグインのインストール

nodenv-updateプラグインを入れると、nodenvのバージョンをアップグレードしてくれるコマンドを使用できます。

ディレクトリを作成して、GitHubからプラグインをcloneします。

cd ~/.nodenv
mkdir plugins
git clone https://github.com/nodenv/nodenv-update.git "$(nodenv root)"/plugins/nodenv-update

以下コマンドを使用して、nodenvとプラグインのアップデートが可能になりました。

nodenv update

nodenvを使用してみる！

nodenvが無事にインストールできたので、早速使用してみます。

globalに設定

PC全体にnodenvの推奨版を設定します。2021.08現在、バージョン14.17.5が推奨でした。

nodenv install 14.17.5
nodenv global 14.17.5 //globalに設定

localに設定

次に、特定のフォルダ内のnodenvを設定してみます。

//14.16.0に設定してみる

nodenv install 14.16.0　
mkdir ~/Desktop/test
cd test
nodenv local 14.16.0

mkdirでデスクトップにtestディレクトリを作成→移動。そのディレクトリ内をバージョン14.16.0に設定しました。

設定できたか確認してみます。

ls -la

.node-version ができていたらOKだそうです。

シェルを立ち上げ直します。

exec $SHELL -l

globalとlocalを行き来して確認してみる

testディレクトリでnode -vすると、v14.16.0

Desktopでnode -vすると、v14.17.5

と、異なるバージョンを設定することができました！

あとがき

ずっと遅れをとっていましたが、やっと設定することができました。

かなり前に自分でnodeを入れていたのでバージョンが古くなっていたのも気になっていて..

推奨版に合わせられてホッとしました。

もりけん先生、ハンズオン資料ありがとうございました！

handsonFrontend/node/nodenv.md at master · kenmori/handsonFrontend
フロントエンドエンジニアを目指す方へのハンズオン資料. Contribute to kenmori/handsonFrontend development by creating an account on GitHub.
github.com

//

【もりけん塾で勉強しています】

もりけん先生(@terrace_tec)のHPはこちら

スポンサーリンク