[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available

根据错误提示说明，和搜索之后得出结论：是项目引入的vue编译版本不对

解决方案1

build/webpack.base.conf.js 并设置vue的alias别名，如下：

1 2 3 4 5

resolve: {    alias: {     vue: 'vue/dist/vue.esm.js'    }   }

解决方案2

打开src/main.js修改Vue对象初始化。

1 2 3 4 5 6

new Vue({  el: '#app',  router,  components: { App },  template: '<App/>' })

改为

1 2 3 4 5

new Vue({  el: '#app',  router,  render: h => h(App) })

原因是，使用 template属性，需要引入带编译器的完整版的vue.esm.js

而如果在.vue文件里面使用

1 2 3 4 5 6 7 8 9 10 11

<template>  <div></div> </template> <script> export default {  name:'name1',  data() {   return {};  } }; </script>

这种形式，然后使用import引入，则不需要完整版的vue.esm.js，因为使用vue-loader时 *.vue文件会自动预编译成js。

其实vuejs官网中已有明确说明

对不同构建版本的解释（https://cn.vuejs.org/v2/guide/installation.html#%E5%AF%B9%E4%B8%8D%E5%90%8C%E6%9E%84%E5%BB%BA%E7%89%88%E6%9C%AC%E7%9A%84%E8%A7%A3%E9%87%8A）