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

z2xy 发布于2019-08-23 12:01 / 2511人阅读

摘要：改为原因是，使用属性，需要引入带编译器的完整版的而如果在文件里面使用这种形式，然后使用引入，则不需要完整版的，因为使用时文件会自动预编译成。其实官网中已有明确说明对不同构建版本的解释其他相关文章理顺个版本的区别

下班过目遇到一个错误

[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: ""
})

改为

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

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

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

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

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

其他相关文章：
理顺8个版本vue的区别（https://segmentfault.com/a/11...）

云服务器 GPU云服务器关于javascript的问题关于php的问题关于系统错误的问题有关于回调的问题

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/97840.html

webpack配合vue.js实现完整的单页面demo

摘要：本篇文章主要是我在开发前研究了的单页面应用，因为需要用到的，所以确保安装了，建议官网安装最新的稳定版本。本文章只是和大家探讨怎么利用配合做一个单页面应用，具体关于里面的内容怎么写并不在本篇文章的介绍范围。本篇文章主要是我在开发前研究了webpack+vue.js的单页面应用，因为需要用到node的npm，所以确保安装了node，建议官网安装最新的稳定版本。并且在项目中需要加载一些np...

2450184176 2019-08-19 18:35 评论0 收藏0
Vue.js中引入图片路径的几种方式

摘要：记录总结一下的中引入图片路径的几种书写方式中静态资源的引入机制关于静态资源的官方文档静态资源可以通过两种方式进行处理在被导入或在中通过相对路径以开头被引用。如果是一个绝对路径，例如，它将会被保留不变。 vue --version 3.6.3记录总结一下的Vue中引入图片路径的几种书写方式 vue中静态资源的引入机制 Vue.js关于静态资源的官方文档静态资源可以通过两种方式进行处理...

adam1q84 2019-08-23 18:09 评论0 收藏0
前端通用国际化解决方案

摘要：前端通用国际化解决方案背景前端技术日新月异，技术栈繁多。接下来针对这几块内容并结合日常的开发流程说明国际化的通用解决方案。文章首发于个人blog，欢迎大家关注。 DI18n 前端通用国际化解决方案背景前端技术日新月异，技术栈繁多。以前端框架来说有React, Vue, Angular等等，再配以webpack, gulp, Browserify, fis等等构建工具去满足日常的开...

lingdududu 2019-08-20 15:46 评论0 收藏0
一字一句的搞懂vue-cli之vue webpack template配置

摘要：神一样的存在。所以呢，就利用两天时间，参考了一些他人的文章，查阅了一些官方的配置，就在此先稍微记录一下。这份配置解析是基于最新版本的。不过，我非常建议，先别看我的文章，自己一句一句的通读一遍。和中的配置含义相似。 webpack--神一样的存在。无论写了多少次，再次相见，仍是初见。有的时候开发vue项目，对尤大的vue-cli感激涕零。但是，但是，但是。。。不是自己的东西，真的很不想折...

atinosun 2019-08-22 11:20 评论0 收藏0
webpack 基础与项目优化实践总结

摘要：前言本文基于，主要涉及基本概念基本配置和实际项目打包优化。关于概念方面参考官网，常用配置来自于网络资源，在文末有相关参考链接，实践部分基于自己的项目进行优化配置。同一文件中，修改某个影响其他。前言：本文基于weboack4.x，主要涉及webpack4 基本概念、基本配置和实际项目打包优化。关于概念方面参考官网，常用配置来自于网络资源，在文末有相关参考链接，实践部分基于自己的项目进行...

Scorpion 2019-08-23 18:15 评论0 收藏0