スタンドアロン版のVue.js devtoolsをmacに入れていくメモ。
なおNode.JSのインストールまでは
MacにNode.jsをインストール
を参考にさせていただいています。
必要なこと
1.Homebrewのインストール(済)
2.nodebrewのインストール
3.Node.jsのインストール
4.Vue.js devtoolsのインストール
Homebrew
HomebrewはMacでのソフトウェアや拡張機能の管理を行うパッケージマネージャです。便利です。
Homebrewのインストールについては
Homebrewのインストール
を参照してます。
環境
開始段階の環境として
・mac OS Catalina 10.15.7
・Homebrew 2.7.1
はインストール済みです。
nodebrewのインストール
・インストール
ターミナルを開いてnodebrewをインストールしていきます。
ターミナル コマンド
brewinstallnodebrew
・確認
インストールできたか確認してみます。
ターミナル コマンド
nodebrew-v
ターミナル 結果
nodebrew1.0.1Usage:nodebrewhelpShowthismessagenodebrewinstall<version>Downloadandinstall<version>(frombinary)nodebrewcompile<version>Downloadandinstall<version>(fromsource)nodebrewinstall-binary<version>Aliasof`install`(Forbackwardcompatibility)nodebrewuninstall<version>Uninstall<version>nodebrewuse<version>Use<version>nodebrewlistListinstalledversionsnodebrewlsAliasfor`list`nodebrewls-remoteListremoteversionsnodebrewls-allListremoteandinstalledversionsnodebrewalias<key><value>Setaliasnodebrewunalias<key>Removealiasnodebrewclean<version>|allRemovesourcefilenodebrewselfupdateUpdatenodebrewnodebrewmigrate-package<version>InstallglobalNPMpackagescontainedin<version>tocurrentversionnodebrewexec<version>--<command>Execute<command>usingspecified<version>Example:#installnodebrewinstallv8.9.4#useaspecificversionnumbernodebrewusev8.9.4
こんな感じでツラツラと出てきたらOKです。
Node.jsのインストール
・インストール
今回はとりあえず最新版をインストールしようと思います。
ターミナル コマンド
nodebrewinstall-binarylatest
ターミナル 結果
Fetching:https://nodejs.org/dist/v15.5.0/node-v15.5.0-darwin-x64.tar.gz########################################################################100.0%Installedsuccessfully
・有効化
最新版をそのまま有効化していきます。
ターミナル コマンド
nodebrewuselatest
ターミナル 結果
usev15.5.0
今回はインストールされている最新版がv15.5.0だったので、これでOKです。
・パスを通す
ターミナルから起動できるようにパスを通します。
ターミナル コマンド
echo'exportPATH=$HOME/.nodebrew/current/bin:$PATH'>>~/.bash_profile
確認のためターミナルで以下のコマンドを実行します。
ターミナル コマンド
node-v
ターミナル 結果
v15.5.0
先程有効化したv15.5.0が表示されました。
これでNode.jsのインストールは完了です。
Vue.js devtoolsのインストール
・インストール
最後に本命のVue.js devtoolsをインストールしていきます。
引き続きターミナルで以下のコマンドを実行します。
ターミナル コマンド
npminstall-g@vue/devtools
なんやかんや出てきます。
ターミナル 結果
added201packages,andaudited202packagesin21s6packagesarelookingforfundingrun`npmfund`fordetailsfound0vulnerabilities
・起動
インストールできたようなので、動作確認していきます。
ターミナル コマンド
vue-devtools