Vue.jsの開発環境を構築したときのメモです。
ビルドツール
公式のツールである Vue CLI 3で開発用アプリケーション起動からリリース用ビルドまでできる。
インストール
# vue-cli (1.x or 2.x) がインストールされている場合はアンインストールする。
npm uninstall vue-cli -g
npm install-g @vue/cli
使い方
# プロジェクトの新規作成
vue create {プロジェクト名}# 対話形式で利用するプラグインを指定する。# 開発用にアプリケーションを起動する。
npm run serve
# リリース用にアプリケーションをビルドする。
npm run build
# Lintを実行する。
npm run lint
参考
エディタ
IDEでワンストップ開発・有償ライセンスを用意できる場合は WebStorm、オープンソース系でやりたい場合は Visual Studio Code + Veturが人気がある。私の場合は開発環境が非力で Vetur がもっさりしていたので Vim + vim-vueを使っている。
参考
- https://www.reddit.com/r/vuejs/comments/864s79/best_ide_for_vuejs/
- https://github.com/vuejs/awesome-vue#source-code-editing
デバッガ
vue-devtoolsでコンポーネントの状態やVuexで管理されている状態、イベントの監視などができる。スタンドアロンアプリケーション（Electron製）の他にChromeもしくはFirefoxプラグイン（ベータ版）が提供されている。