通过脚手架快速创建的项目,使用了swiper组件,项目中使用了es6语法,使用了babel-polyfill转化依旧不行,仔细排查项目中的使用组件,最后找到问题所在

swiper4.5.0版本太高,不支持IE11 转化报错了,报错如下

查阅网上资料,并没有这个解决的方案,于是每一项逐项排查,起初用到vue中路由懒加载resolve使用,以及封装了请求接口api.js中的箭头函数使用,于是我一项项去解决,修改项目的整体结构,从main.js中修改引入的一些组件和插件,最后我找到了使用的swiper版本过高,更换为swiper3.4.0版本就可以兼容项目,完美实现兼容,这里提醒大家注意swiper使用4.x和3.x的用法区别,尤其是自动播放属性autoplay的修改,更多的请去看swiper的api。

二,解决打包样式不兼容问题

在开发坏境中,我们的使用了less起编写我们的样式,因为使用颜色函数,以及使用的组件化样式,而打包后我们兼容性写法不生效了,没有这个代码,那么需要我们修改一下配置

webpack.prod.config.js中去掉 (55行)

// new OptimizeCSSPlugin({
// cssProcessorOptions: config.build.productionSourceMap
// ? { safe: true, map: { inline: false } }
// : { safe: true }
// }),

在utils.js中加入28行后面加入下面这一句,只要前面的逗号

minimize:true

重新打包就可以解决问题

vue中使用的一些问题(IE不兼容,打包样式不生效)的更多相关文章

  1. 黑马vue---16、vue中通过属性绑定为元素设置class类样式

    黑马vue---16.vue中通过属性绑定为元素设置class类样式 一.总结 一句话总结: 这里就是为元素绑定class样式,和后面的style样式区别一下 vue中class样式绑定方式的相对于原 ...

  2. vue中,svg图标添加click事件,部分浏览器不生效

    vue项目中,使用svg图标,但是发现,为svg图标绑定click事件时,部分浏览器会出现,点击没有反应的情况,代码如下: <icon name="icon_add" @cl ...

  3. 第二章 Vue快速入门-- 15 vue中通过属性绑定为元素设置class类样式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  4. VUE中使用canvas做签名功能,兼容IE

    <template>         <div>           <div class="msgInput">             &l ...

  5. vue中路由按需加载的几种方式

    使用vue-cli构建项目后,我们会在Router文件夹下面的index.js里面引入相关的路由组件,如: import Hello from '@/components/Hello' import ...

  6. vue中如何不通过路由直接获取url中的参数

    前言:为什么要不通过路由直接获取url中的参数? vue中使用路由的方式设置url参数,但是这种方式必须要在路径中附带参数,而且这个参数是需要在vue的路由中提前设置好的. 相对来说,在某些情况下直接 ...

  7. vue中的重要特性

    一.vue中的自定义组件 html的代码: <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  8. Vue中comoputed中的数据绑定

    Vue中的数据实现响应式绑定是在初始化的时候利用definePrototype的定义set和get过滤器,在进行组件模板编译时实现water的监听搜集依赖项,当数据发生变化时在set中通过调用dep. ...

  9. vue中使用stompjs实现mqtt消息推送通知

    最近在研究vue+webAPI进行前后端分离,在一些如前端定时循环请求后台接口判断状态等应用场景用使用mqtt进行主动的消息推送能够很大程度的减小服务端接口的压力,提高系统的效率,而且可以利用mqtt ...

随机推荐

  1. three.js实现世界3d地图

    概况如下: 1.THREE.Shape绘制世界地图平面地图: 2.THREE.ExtrudeGeometry将绘制的平面沿着Z轴拉伸,实现3d效果: 效果图如下: 预览地址:three.js实现世界3 ...

  2. CentOS安装Docker-ce并配置中国国内加速(aliyun)镜像

    前提条件 1.系统.内核 CentOS7 要求64位系统.内核版本3.10以上 CentOS6 要求版本在6.5以上,系统64位.内核版本2.6.32-431以上 查看内核版本号 uname -r # ...

  3. sql server 随记 -- 月份/日期 查询

    月份 SELECT * FROM ( ] ) a UNPIVOT ( xxx ]) ) a2; 日期 SELECT * FROM ( ] )a UNPIVOT( xxx ]) )a2 (存档)

  4. Java生鲜电商平台-订单配送模块的架构与设计

    Java生鲜电商平台-订单配送模块的架构与设计 生鲜电商系统最终的目的还是用户下单支付购买, 所以订单管理系统是电商系统中最为复杂的系统,其作为中枢决定着整个商城的运转, 本文将对于生鲜类电商平台的订 ...

  5. Java日期时间API系列4-----Jdk7及以前的日期时间类的线程安全问题

    1.Date类为可变的,在多线程并发环境中会有线程安全问题. (1)可以使用锁来处理并发问题. (2)使用JDK8  Instant 或 LocalDateTime替代. 2.Calendar的子类为 ...

  6. kafka集群在消息消费出现无法找到topic分区的处理解决

    最近几天在做spark数据同步过程中,中间通过kafka集群处理消息,每次同步到一半就会出现同步不了 查看日志如下: 最开始看到这个问题很懵逼,完全找不到解决问题的切入口,期间也询问了架构师-因为这个 ...

  7. jQuery Migrate 插件用法

    jQuery Migrate是应用迁移辅助插件,是用于高级版本兼容低级版本辅助插件.例如jQuery版本用的是1.x,计划升级到3.x,就可以在页面删除1.x版本,换成3.x版本,如果有脚本错误,就引 ...

  8. element-ui修改表单自带验证的样式

    1.比如重写在表单自带验证的样式 .el-form-item__error是对应是的文字的类名,图标我是通过伪元素插进去的 下面是伪元素代码 基本上要重写样式的,到控制台看样式名,因为是封装的,所以有 ...

  9. [Linux]gocron定时任务平台的部署

    采用二进制文件的方式部署非常简单,因为go已经把源码打包成了可执行文件,下载下来直接运行就可以了,不需要自己去编译和配置依赖 下载执行文件的地址是:https://github.com/ouqiang ...

  10. [日常] 免费的文本比较工具Meld使用

    需要在linux桌面环境进行文件比较的时候,发现的一款文本比较工具,并且还有windows版本.之前一直在windows下使用的是beyond compare这个的破解版,这个软件本身是收费的而且还非 ...