Edited at

Vue.js を導入するとコンソールエラーになるとき

More than 1 year has passed since last update.


環境


  • vuejs v2.5.13

  • gulp v3.9.1


実行コード


app.js

import Vue from "vue";

import VueRouter from "vue-router";

Vue.use(VueRouter);

const Foo = { template: '<div>foo</div>' }
const Bar = { template: '<div>bar</div>' }

const routes = [
{ path: '/foo', component: Foo },
{ path: '/bar', component: Bar }
]

const router = new VueRouter({
routes
})

const app = new Vue({
router
}).$mount('#app')



コンソールエラー

Router [Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.


解決策


package.json

  "browser": {

"vue": "vue/dist/vue.common.js"
},


Ref.

https://router.vuejs.org/ja/essentials/getting-started.html

https://aloerina01.github.io/javascript/vue/2017/03/08/1.html