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

相信很多初学者使用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', ，然后重新运行编译就可以了