Vue.js+VueRouter+Vuex開発環境構築手順

ローカルでのVue.js+VueRouter+Vuexの開発環境構築をしたので記録しておきます。

検証環境バージョン

• Node.js v14.16.0
• npm7.6.3

Vue CLIインストール

npm install -g @vue/cli
npm install -g @vue/cli-service-global

Vue UI起動

vue ui

プロジェクト作成

起動したwebUI（localhost:8000）からカレントディレクトリにプロジェクトを作成する。

Vue Router, Vuexインストール

webUIのプラグインからインストールする。

開発環境アクセス

webUIのタスクからserve実行で開発環境（localhost:8080）にアクセスできるので、プロジェクト作成したsrc内のファイルが反映されている。

以下コマンドで開発環境を起動も出来ます。

npm run serve

以上です。フロントだけの環境だからだと思いますが、これだけで出来ちゃうのは凄いですね。こういった環境が手軽だからこそVue.jsは敷居が低いのかと思いました。