關於vue編譯版本引入的問題

下班過目遇到一個錯誤

[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.

根據錯誤提示說明，和搜索以後得出結論：是項目引入的vue編譯版本不對

解決方案1

build/webpack.base.conf.js 並設置vue的alias別名，以下：

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

解決方案2

打開src/main.js修改Vue對象初始化。

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

改成

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

緣由是，使用 template屬性，須要引入帶編譯器的完整版的vue.esm.js

而若是在.vue文件裏面使用

<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...）

其餘相關文章：
理順8個版本vue的區別（https://segmentfault.com/a/11...）