Node.js のバージョン管理を nodebrew で行った際、VS Code に反映されなかった #Node.js

Prologue

稼働しているプロジェクトで node.js のバージョンが低く、パッケージがインストールできない問題が発生しました。
単純にバージョンをあげてもよかったのですが、以前 node.js のバージョンがチーム内で異なっていて検証がうまく進まなかったことがあったため、これを期に nodebrew で管理することにしました。
インストール自体はそれなりにスムーズにできたのですが、VS Code で使用した際にエラーが出たため、その辺りも含めて記載しておきます。
内容は Try&Error のため、不要な内容も入っているのでご注意ください。
最後にスムーズにいく流れを記載しています。(-> まとめ)

環境

macOS: 10.15.4
terminal: iTerm
VS Code 使用
Project概要
- パッケージマネージャ: yarn

参考: https://github.com/hokaccha/nodebrew

homebrew がインストールされていることを確認

以下は全て iTerm で作業していきます。

brew -v
Homebrew 2.4.0 // バージョン情報が表示される

yarn と node のアンインストール

brew uninstall node
brew uninstall yarn

削除されていることを確認

brew ls
// node と yarn がなければ成功

nodebrew のインストール

brew install nodebrew

インストールされていることを確認

nodebrew -v
nodebrew 1.0.1 // バージョン情報が表示される

nodebrew を使って node.js をインストール

nodebreｗでインストールできるバージョンは以下で確認できます。

nodebrew ls-remote

今回は最新の安定版を使いたかったので、以下をインストール。
参考: https://nodejs.org/ja/

nodebrew install v12.18.0

余談ですが、この記事を書いているほんの数時間前(インストールは終わっていた)、v12.18.1 がリリースされていました。こういうことがままあるので面白いなと思います。

インストールされていることを確認。

nodebrew ls

v12.18.0 // インストールしたバージョンがあることを確認

インストールしたバージョンを使うよう設定します。

nodebrew use v12.18.0

設定されていることを確認します。

node -v
v10.16.0

反映されていなかったので、以下を対応

以下のコマンドはもうないかもしれないので、必要ないかもしれません。
実行せずにできていたらフィードバックお願いします。(->追記)

nodebrew setup

node が他にないか確認します。

which node

パッケージがあったため、以下のコマンドで削除します。
削除する際には自己責任でお願いします。

rm -rf /usr/local/bin/node

それでも反映されないため、環境PATH の設定を確認、書いていなかったため追記します。

vi ~/.bash_profile

export PATH=$HOME/.nodebrew/current/bin:$PATH // .bash_profileに追記

こちらに関しては nodebrew をインストールした際に、きちんと書かれていました。読み飛ばしていましたね。
実際書く際には、インストール時の内容を読んで、そちらを記載してください。

ファイルを更新します。

source ~/.bash_profile

node -v でバージョンが変わっていることを確認します。

最後に yarn をインストール。

brew install yarn

zsh を使用していたので、設定内容を移動します。

cp -a ~/.bash_profile ~/.zprofile

内容の確認とファイルの更新を行います。

vi .zprofile
source .zprofile

VS Code で yarn コマンドが使えない

ここまでで問題なく iTerm で yarn も node も使えていたのですが、VS Code では node -v すらも使えない、という事象が起こりました。

エラー内容

env: node: No such file or directory

試しにグローバルに node.js をインストールすると使えます。でもそれだと結局バージョン管理ができないため、どうしても解決したい。

node 周りをもう一度きれいにしてみる。

yarn をインストールすると一緒に node もインストールされるとのことなので、一度 yarn をアンインストールします。
アンインストールする前に brew ls で確認すると、 yarn と一緒に node もいることが確認できるので、気になる方は確認してみてください。

brew uninstall yarn
brew uninstall node
brew ls
// node と yarn がないことを確認

次に、 yarn をインストールする際に node は無視するよう、以下のコマンドを実行しましたが、エラーが出ました。

brew install yarn --ignore-dependencies
// 略

Warning: --ignore-dependencies is an unsupported Homebrew developer flag!
Adjust your PATH to put any preferred versions of applications earlier in the
PATH rather than using this unsupported flag!

==> Downloading https://yarnpkg.com/downloads/1.22.4/yarn-v1.22.4.tar.gz
Already downloaded: /Users/mi***/Library/Caches/Homebrew/downloads/42**--yarn-v1.22.4.tar.gz
Error: An exception occurred within a child process:
  RuntimeError: /usr/local/opt/node not present or broken
Please reinstall node. Sorry :(

node が存在しないか壊れている？とのことなのですが、解決策が見つからないため、一度 yarn を node ありでインストールし、その後 node のみをアンインストールしてみました。

brew install yarn
brew uninstall --ignore-dependencies node
brew ls
icu4c       nodebrew    yarn

brew ls で node がないことを確認。

検証のためにインストールしたnodeパッケージを再度削除。
削除する際は自己責任でお願いします。

rm -rf /usr/local/bin/node
which node
/Users/mi**/.nodebrew/current/bin/node

node は .nodebrew 以下にしかないことが確認できました。

ここまで書いてきて、ふと環境変数PATHとは？また、それを記載するファイルがあっているのか疑問に思い調べてみると、zsh の場合 .zshrc に記載するのが正しいそうです。

ファイルを再度移動させます。

cp -a  ~/.zprofile ~/.zshrc
source ~/.zshrc

整理するために、以下のファイルを削除しました。
私の場合、中身は今回のために作ったものなので空っぽであることを確認してから行います。
他にも記載がある場合には、自己責任で行ってください。

rm .bash_profile
rm .zprofile
ls -a // ファイルが存在しないことを確認

ここまで書いても、 VS Code では node が反応しません。
環境変数PATHについてこちらの記事がわかりやすくて読み進めていたら、気になる言葉が...

参考: https://qiita.com/fuwamaki/items/3d8af42cf7abee760a81

exportで操作した環境変数は、設定したTerminalでだけにしか反映されません。

そのために .zshrc に環境変数PATHを記載をする。 .zshrc は再起動や更新のタイミングで読み込まれる...

今回、プロジェクトの作業中にこれらの対応を行っていたので、VS Codeは開いたまま、iTerm で nodebrew の対応を行っていました。
つまり、VS Code のターミナルは一度閉じるか更新するかしないと環境変数PATH が使えないということですね。

VS Code の Terminal で以下の手順で対応。

vi .zshrc 
source .zshrc
node -v
v11.11.0 // 検証のためもう一つインストールしていたためこれでOK
yarn

プロジェクトごとに複数 VS Code を開いていたため、もう一つは一度閉じて再起動してみましたが、きちんと反映されていました。

その後念のため iTerm にて、 nodebrew でバージョンを変更。VS Code の方は開いたまま node -v で確認するときちんとバージョンが変わっていることが確認できました。

追記: `nodebrew setup`

install した node を格納しておく .nodebrew/src ディレクトリを作成するコマンドのようです。
この対応をしないと、以下のようなエラーが出ました。

nodebrew install v12.18.2

Fetching: https://nodejs.org/dist/v12.18.2/node-v12.18.2-darwin-x64.tar.gz
Warning: Failed to create the file 
Warning: /Users/mi**/.nodebrew/src/v12.18.2/node-v12.18.2-darwin-x64.tar.gz
Warning: : No such file or directory

curl: (23) Failed writing body (0 != 979)
download failed: https://nodejs.org/dist/v12.18.2/node-v12.18.2-darwin-x64.tar.gz

nodebrew setup を実行すると、 .nodebrew/src が作成され、無事インストールすることができました。

まとめ

Try＆Error で時系列的に書いてきましたが、手順をまとめると以下になります。

homebrew で yarn と node を削除する。
which node で他に node を使っていないか確認し、必要があれば削除する。
nodebrew をインストールする。
使っているPCに応じて、環境変数PATHを設定し、Teminal を再起動するかファイルを更新する。
.nodebrew/src を実行し、ディレクトリを作成する。
nodebrew で使いたいバージョンの node.js をインストールし、それを使用するようコマンドを実行する。
yarn を再インストールする。この際、依存している node はインストールされないよう気を付ける。
他に使用するTerminal があれば、一度再起動するか、環境変数PATH を追記したファイルを Terminal ごとに更新する。

Epilogue

環境変数PATH を設定しなくても nodebrew が動いたためそのまま進めていたことがまず敗因でした。反省。
また、 Terminal ごとに .zshrc が読み込まれることや環境変数PATH, node の取り扱いについては逆に複数の Terminal を操作していなかったら気づけなかったと思うので、とても痛い目を見ましたが、怪我の巧妙とできてよかったです。

Node.js のバージョン管理を nodebrew で行った際、VS Code に反映されなかった