anyenvを利用した開発をVisual Studio Codeで実施する際は**env/shimsのパスを指定する

事業開発部の野村です。デレマスの関裕美の中の人のTwitterを見ることが最近の密かな楽しみです。

Visual Studio Code(以下vscode)で、anyenv(ndenv)で導入したnode.jsのプロジェクトを開発する際に、nodeやnpmコマンドのパスがanyenvのパスではなくシステムのパスを見ていたことが分かりました。結論としてはタイトルの通りですが、詳しい調査経緯と解決策を共有させていただきます。

ndenvに限らずrbenvなど他の言語を導入した開発でも同様のことが起こり得ると思います。

検証環境

• MacOS High Sierra(バージョン10.13.1)
• Visual Studio Code(バージョン1.18.1)
• anyenvとndenvをGithubのREADMEに従いインストール済み
  • https://github.com/riywo/anyenv

事の発端

macOSのvscodeを使ってnode.jsのプロジェクトの開発をする際、私はvscodeのターミナルを使ってnpmコマンドを確認しています。ある日新規でAWS Lambda開発用にnode.jsプロジェクトを用意して、vscodeのターミナル上でプロジェクト上のnodeのバージョンを設定しても、期待したバージョンになっていないことを確認しました。

こんな感じ↓

$ ndenv install v6.10.3
$ ndenv local v6.10.3
$ node -v
v8.6.0

v6.10.3を指定したのに、バージョンが変わらない。。

macOSのターミナル上だとちゃんとバージョンが変わっていることを確認しています。

$ ndenv local v6.10.3
$ node -v
v6.10.3

調べてみる

nodeパス確認

nodeコマンドのパスをvscodeのターミナル上で調べてみました。

 $ which node
/usr/local/bin/node

↑anyenvではなくmacOSのシステム上のパスを見てますね。。

macOSのターミナル上で確認してみると下記のように確認できます。

$ which node
<HOMEのパス>/.anyenv/envs/ndenv/shims/node

環境変数$PATHの確認

では、今度はvscodeのターミナル上で環境変数$PATHの内容を確認します。

$ echo $PATH | sed -e 's/:/\
> /g'
<HOMEのパス>/.anyenv/envs/ndenv/bin
<HOMEのパス>/.anyenv/bin
/usr/local/bin
/usr/bin
<中略>
<HOMEのパス>/.anyenv/envs/ndenv/shims
<中略>

↑/usr/local/binが、ndenvで導入したnodeがあるndenv/shimsより優先されています。

通常のターミナル上だとndenvのパスの方が優先されていることが確認できます。

echo $PATH | sed -e 's/:/\
> /g'
<HOMEのパス>/.anyenv/envs/ndenv/bin
<HOMEのパス>/.anyenv/bin
<中略>
<HOMEのパス>/.anyenv/envs/ndenv/shims
<中略>
/usr/local/bin
/usr/bin
<中略>

対策

anyenvのインストールをGithubのREADMEに従って行うと、bashやzshのprofileファイルに下記のようにパスの定義が行われます。

export PATH="$HOME/.anyenv/bin:$PATH"
eval "$(anyenv init -)"

通常ではこの定義だけでも十分なのですが、今回の問題を解消させるため$HOME/.anyenv/envs/**env/shims (ndenv以外についても同様の対応を実施)を優先的にパス読み込ませるようにします。

export PATH="$HOME/.anyenv/bin:$PATH"
eval "$(anyenv init -)"
for D in `ls $HOME/.anyenv/envs`
do
  export PATH="$HOME/.anyenv/envs/$D/shims:$PATH"
done

再度vscodeのターミナルを開き直して$PATHを確認します。

$ echo $PATH | sed -e 's/:/\
> /g'
<HOMEのパス>/.anyenv/envs/ndenv/shims
<HOMEのパス>/.anyenv/envs/ndenv/bin
<HOMEのパス>/.anyenv/bin
/usr/local/bin
/usr/bin
<中略>

/shimsのパスが優先されるようになりました。続いてnodeのパスとバージョンも確認します。

$ which node
<HOMEのパス>/.anyenv/envs/ndenv/shims/node
$ node -v
v6.10.3

当初の期待通りanyenvのndenvのパスを読み込んでくれました。

参考情報

• anyenvで開発環境を整える - Qiita
  • tmux でも同様のことが起こるようです。

まとめ

これでvscode上でもnodeのバージョン切り替えが適切に行えるようになりました。また開発での気づきがあれば、適宜共有していこうと思います！

それでは。