vue.jsで「command not found」エラー

Question

久しぶりにvue-cliを使おうとして以下エラーが出ました。

zsh: command not found: vue

元々のvueをアンインストールし、
下記コマンドでインストールしなおしました。

npm install --global vue-cli

しかしまだ同様のエラーが出てしまいます
解決方法を教えてください！

試したこと

ググって調べた通りにパスを通しました。
.zshrcにvueのパスを記載しました。一番下の行です。

export PS1="%~ %n "

# pyenvを動かすために以下を追記
export PYENV_ROOT="$HOME/.pyenv"
export PATH="$PYENV_ROOT/bin:$PATH"
eval "$(pyenv init -)"

export PATH="/Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin:$PATH"

それでも上手くいかなかったので
.bash_profileにもパスを記載しました。

export PATH="/Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin:$PATH"

環境情報など

MAC OS Catalina
バージョン 10.15.7

npm version 6.14.6

追記

インストール時の出力

$ npm install --global vue-cli 
npm WARN deprecated vue-cli@2.9.6: This package has been deprecated in favour of @vue/cli
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
/Users/nakamura/.npm-global/bin/vue-init -> /Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin/vue-init
/Users/nakamura/.npm-global/bin/vue -> /Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin/vue
/Users/nakamura/.npm-global/bin/vue-list -> /Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin/vue-list
+ vue-cli@2.9.6
added 236 packages from 204 contributors in 6.759s

Answer 1

エラー解消までの手順が分かったので、最初から記載しようと思います。

①.zshrcファイルに以下のパスを追記

export PATH="/Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin:$PATH"

②下記を実行して、.zshrcファイルの変更内容を反映させる

source .zshrc

③これでvueコマンドを打つことができました！

$ vue -V
2.9.6

Comments

[technocore]

＞MAC OS Catalina バージョン 10.15.7

Catalinaのデフォルトシェルはzshですが、あなたのMacOSはbashなのですか？

[teltel07]

あ〜
両方に書いて、どちらにもsourceをやってみたらできました。
片方づつ試したらおっしゃる通りzshの方でした！
なので修正しておきます！

[technocore]

PATHなどの環境変数は
bashなら、.bash_profile
zshなら、.zprofile
に書くのが基本です。
基本に合わせておくと良いでしょう。

[teltel07]

承知しましたー！
いろいろご教示いただきありがとうございます！！

Answer 2

下記コマンドでインストールしなおしました。
npm install --global vue-cli

そのコマンドを実行すれば、終了後にインストール先が表示されます。
そのインストール先にPATHを通せば良いです。

ググって調べた通りにパスを通しました。

ググって見つけても、あなたの環境と同じとは限りません。

Comments

[teltel07]

ご回答ありがとうございます！
説明不足ですみません。以下記事を参考にして
https://qiita.com/sam_sam/items/50c96a0510e9ea389195
自分のインストール先を調べてその結果
```
export PATH="/Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin:$PATH"
```
を追加したのですが、
それでもコマンド叩けませんでした。
他に考えられる原因はありますでしょうか？m(__)m

[technocore]

そのパスの場所にvueコマンドは存在するのですか？

[teltel07]

確認しましたが、存在するようです。

$ pwd
/Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin
$ ls -ltr
total 40
-rwxr-xr-x 1 nakamura staff 309 10 2 2017 vue-build
-rwxr-xr-x 1 nakamura staff 775 10 2 2017 vue-list
-rwxr-xr-x 1 nakamura staff 3953 2 5 2018 vue-init
-rwxr-xr-x 1 nakamura staff 438 6 1 2018 vue-create
-rwxr-xr-x 1 nakamura staff 380 6 5 2018 vue

[technocore]

$ type vue
でvueコマンドが見つかりますか？

[teltel07]

見つかりました！
$ type vue
vue is /Users/nakamura/.npm-global/lib/node_modules/vue-cli/bin/vue

そして、いろいろ試した結果、
source .bash_profile
で、パス追加を反映させる、と言うのをやるとできました！
$ vue -V
2.9.6
いろいろご教授いただきありがとうございました！