サクっとWebアプリを作りたくなったときにやってること

いつもvueの公式boilerplateにちょい足ししてる
公開はビルドしたやつをfirebaseでホスティングが手っ取り早い

Node, yarn, VueCLIが入っているのが前提
Node, VueCLIは必須、yarnはnpmで代用可

セットアップ

$ vue init webpack <APP_NAME>
$ cd <APP_NAME>
$ yarn
$ yarn add material-design-icons-iconfont roboto-fontface material-design-icons-iconfont vue-material vuex lodash
$ yarn add -D node-sass sass-loader pug pug-loader stylus stylus-loader
$ yarn dev

ホットリロード

インポーーーート

/src/main.js

/* css */
import 'material-design-icons-iconfont'
import 'roboto-fontface'
import 'vue-material/dist/vue-material.css'

/* libraries */
import Vue from 'vue'
import VueMaterial from 'vue-material'
import Vuex, { Store } from 'vuex'
import _ from 'lodash'
import App from './App'

Vue.use(VueMaterial)
Vue.use(Vuex)
Vue.config.productionTip = false

const store = new Store({
  // Vuex Store here
})

/* eslint-disable no-new */
new Vue({
  el: '#app',
  template: '<App/>',
  components: { App },
  store
})

• Vuex要らん規模のやつが多いけどコンポーネントの親子関係をごにょごにょするのがめんどくさいときは一元化したりする
• 規模がでかいときはVuexの記述を別ファイルに分ける
• lodashも使う時と使わん時がある
• MDLとかRobotoのcssはデフォルトで.sassを読み込むのでsass-loaderが必須(ファイル構造を漁って.cssを直接指定してやれば多分不要)
• VueMaterialが有能なのでstylusもあんま要らん
• pugは好きなので要る