IE9样式错乱,IE11无法正常加载v-loading等问题 引入了babel-polyfill插件,依然出现”polyfill-eventsource added missing EventSource to window”的奇怪问题(ie所有版本都有出现)
第一步:安装babel-ployfill (已安装请跳过此步骤)
yarn add babel-ployfill修改webpack打包配置文件:webpack.bash.conf.js
// 引入babel-ployfill
var babelPloyfill = require('babel-ployfill') // ...
// 修改entry字段
entry: {
// app: './src/main.js'
app: ["babel-polyfill", "./src/main.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文件// 引入依赖
var CSSSplitWebpackPlugin = require('css-split-webpack-plugin').default // 在css打包插件后面新增css分割插件
new ExtractTextPlugin({
filename: utils.assetsPath('css/[name].[contenthash].css')
}),
// 新增的css分割插件
new CSSSplitWebpackPlugin({
size: 4000,
filename: utils.assetsPath('css/[name]-[part].[ext]')
}),
IE9样式错乱,IE11无法正常加载v-loading等问题 引入了babel-polyfill插件,依然出现”polyfill-eventsource added missing EventSource to window”的奇怪问题(ie所有版本都有出现)的更多相关文章
- Windows系统盘符错乱导致桌面无法加载。
问题如下 : 同事有台笔记本更换SSD硬盘,IT职员帮他将新硬盘分好区后再将系统完整Ghost过来,然后装到笔记本上.理论上直接就可以使用了!但结果开机后登陆用户桌面无法显示,屏幕黑屏什么都没有. 问 ...
- 在IIS上新发布的网站,样式与js资源文件加载不到(资源文件和网页同一个域名下)
在IIS上新发布的网站,网站能打开,但样式与js资源文件加载不到(资源文件和网页是同一个域名下,例如:网页www.xxx.com/index.aspx,图片www.xxx.com/pic.png). ...
- CSS样式表、JS脚本加载顺序与SpringMVC在URL路径中传参数与SpringMVC 拦截器
CSS样式表和JS脚本加载顺序 Css样式表文件要在<head>中先加载,这样网页显示时可以第一次就渲染出正确的布局和样式,网页就不会闪烁,或跳变 JS脚本尽可能放在<body> ...
- 《动手实现一个网页加载进度loading》
loading随处可见,比如一个app经常会有下拉刷新,上拉加载的功能,在刷新和加载的过程中为了让用户感知到 load 的过程,我们会使用一些过渡动画来表达.最常见的比如"转圈圈" ...
- ajax加载菊花loading效果
Ajax异步请求的时候,一般都会利用一个动态的gif小图片来制作一个Ajax Loading,以便增加用户体验. 这里我们可以使用Spin.js,该js脚本压缩后5k,可以不用任何图片,任何外部CSS ...
- fakeLoader页面加载前loading演示8种效果
提高用户体验的插件fakeLoader页面加载前loading演示8种效果 在线预览 下载地址 示例代码 <div id="main"> <div class=& ...
- cocos2d-x游戏开发(十五)游戏加载动画loading界面
个人原创,欢迎转载:http://blog.csdn.net/dawn_moon/article/details/11478885 这个资源加载的loading界面demo是在玩客网做逆转三国的时候随 ...
- 页面加载时loading效果
页面加载时loading效果: <!DOCTYPE html> <html lang="en"> <head> <meta charset ...
- WPF自定义控件与样式(11)-等待/忙/正在加载状态-控件实现
一.前言 申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要有三种实现方式 ...
随机推荐
- C#泛型。
作用: 使用泛型可以实现算法重用. class Program { static void Main(string[] args) { MyClass<string> myClass = ...
- SQL命令入门。
1.创建数据库:create database ***: 2.删除数据库:drop database ***: 3.创建数据库的时候设置一些参数选项. create database MyDatab ...
- 第一册:lesson7-8.
原文:Are you a teacher? A:I am a new student ,my name is A. B:Nice to meet you,my name is B. A:Are yo ...
- 有关于MVC SignalR的问题
刚拜读 @Learning hard 的 [Asp.net 开发系列之SignalR篇]专题一:Asp.net SignalR快速入门 跟着博文一步步操作,这是新人的学习方式 然而笔者的开发环境和 @ ...
- c# 画布验证码
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- EChart中使用地图方式总结(转载)
EChart中使用地图方式总结 2018年02月06日 22:18:57 来源:https://blog.csdn.net/shaxiaozilove/article/details/79274772 ...
- C#设计模式之十四命令模式(Command Pattern)【行为型】
一.引言 今天我们开始讲“行为型”设计模式的第二个模式,该模式是[命令模式],又称为行动(Action)模式或交易(Transaction)模式,英文名称是:Command Pattern.还是老套路 ...
- Java设计模式 - 单例模式详解(扩展)
单例模式引发相关整理 如何破坏单例模式 示例: /** * 如果破坏单例模式 * * @author sunyang * @date 2018/11/13 20:14 */ public class ...
- struts2框架-----Action
控制器Action Action对象是struts2框架的核心,每个URL映射到特定的Action,其提供处理来自用户的请求所需要的处理逻辑.Action有两个重要的功能,即将数据从请求传递到视图和协 ...
- es6 语法 (数值扩展)
{ //二进制数值都是0b开头,八进制0o console.log(0b111110111) console.log(0o767); } { console.log('15',Number.isFin ...