关于vue编译版本引入的问题

下班过目遇到一个错误html

[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编译版本不对vue

解决方案1webpack

build/webpack.base.conf.js 并设置vue的alias别名,以下:web

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

解决方案2segmentfault

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

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

改成ide

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

缘由是,使用 template属性,须要引入带编译器的完整版的vue.esm.jsui

而若是在.vue文件里面使用code

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

这种形式,而后使用import引入,则不须要完整版的vue.esm.js,由于使用vue-loader时 *.vue文件会自动预编译成js。component

其实vuejs官网中已有明确说明
对不一样构建版本的解释(https://cn.vuejs.org/v2/guide...

其余相关文章:
理顺8个版本vue的区别(https://segmentfault.com/a/11...

相关文章
相关标签/搜索