解决Vue+Element ui开发中碰到的IE问题

2024-06-24 11:07:29阅读量:36 字体:

IE9样式错乱,IE11无法正常加载v-loading等问题

引入了babel-polyfill插件,依然出现”polyfill-eventsource added missing EventSource to window”的奇怪问题(ie所有版本都有出现)

第一步:安装babel-ployfill (已安装请跳过此步骤)

解决Vue+Element ui开发中碰到的IE问题

修改webpack打包配置文件:webpack.bash.conf.js

重新运行,v-loading等问题完美解决, 原因可能是v-loading是调用的ES6的Object的setter和getter方法来实现的,babel-ployfill报错,未能将ES6的方法完全转换为IE9支持的ES5方法

IE9样式错乱

可能的原因1,element-ui 中使用了 display: flex; 样式,IE9不支持次样式,解决方法为,排查下各组件,避免使用带 display: flex; 的组件

可能的原因2,IE9浏览器过于老旧,单文件最大行数超过一定限制将不再读取后边的内容,因此可以尝试分割css文件和打包的js文件

分割js文件,最好的方法是采用vue的路由懒加载,这样打包时,vue-loader会把每个路由对应的js文件打包在一起。同时注意组件的合理划分,避免单组件体积过大,并提高组件的复用性

分割css文件,通过yarn add css-split-webpack-plugin -D安装css-split-webpack-plugin包来分割组件,修改

webpack.prod.conf.js文件

推荐阅读

  • 微信很小的那种表情包怎么做的

    微信很小的那种表情包怎么做的

    平常生活中微信很小的那种表情包可以在微信的小程序里根据自己的喜好进行制作,通过以下步骤制作微信表情包: 微信很小的那种表情包怎么做的 1、打开微信,切换到发现页面,点击小程序”进入小程序页...

    阅读: 1499

  • 剪映怎么在中间插视频

    剪映怎么在中间插视频

    想要使用剪映视频中间插入另一个视频,可以把原本视频分割再插入新的视频,通过以下步骤使用剪映在中间插视频: 剪映怎么在中间插视频 1、打开剪映,点击开始创作”进入选择页面。 2、选择一个视...

    阅读: 876

  • qq进群特效怎么关闭

    qq进群特效怎么关闭

    想要关闭qq进群特效,可以在qq群的进群特效相关功能进行关闭,开通超级会员才能享受进群特效,通过以下步骤关闭qq进群特效: qq进群特效怎么关闭 1、打开qq,点击qq群”进入qq群聊天页...

    阅读: 816

  • 地摊怎么申请微信商家码

    地摊怎么申请微信商家码

    地摊想要申请微信商家收款二维码,可以从微信收款小账本进行相关设置即可申请微信商家收款二维码,通过以下步骤可以申请微信商家收款二维码: 地摊怎么申请微信商家码 1、打开微信,切换到发现页面,点击小程序&...

    阅读: 914

  • 微信拉黑和删除

    微信拉黑和删除

    微信加入黑名单后给对方发消息,对方可以看到但不能回复,微信删除后双方都不能发消息,微信拉黑和删除具体步骤如下: 微信拉黑和删除 1、打开微信,切换到通讯录页面,点击联系人”进入联系人名片...

    阅读: 852

  • qq音乐删除访问记录别人能看见吗

    qq音乐删除访问记录别人能看见吗

    qq音乐删除了访问记录别人是不能看到的,可以在访客功能中删除访问记录,通过以下步骤删除qq音乐访问记录: qq音乐删除访问记录别人能看见吗 1、打开qq音乐,切换到个人中心,点击头像”进入...

    阅读: 809