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

版权声明：本文为博主原创文章，转载请注明原创链接，感谢支持！（如文章有侵权，请联系作者删除） https://blog.csdn.net/qq_35324453/article/details/80920344

相信很多初学者使用vue-cli2.x初始化脚手架项目的时候或者webpack配置的时候会遇到这个问题：

一开始初始化项目配置的时候，有两个运行环境配置的版本：Compiler版本、Runtime版本。

简单说一下这两个版本的区别：

1. 当对template模板内容编译是需要对字符串进行模板渲染或者可以绑定的html对象作为模板进行渲染的方式，就需要使用Compiler版本。示例如下：

   new Vue({
   el:'#vue-app',
   template:'<div><h1>{{test}}</h1></div>',
   data:{
   test:'hello'
   }
   });

2. 如果使用vue-loader加载.vue文件时（组件文件），webpack在打包对模板进行了渲染，就需要Runtime版本。示例如下：

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

从Compiler版本修改为Runtime版本。只需如示代码：

添加一行代码：

'vue$': 'vue/dist/vue.esm.js',

，然后重新运行编译就可以了

阅读更多