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自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接. 本文主要有三种实现方式 ...
随机推荐
- JQuery ajax的使用
JQuery 真的是好东西 $.ajax({ type: "post", url: "/DataCheck", ...
- ADO.NET基础学习 一(连接数据库)
(记录下方便自己复习) 概念 简单地理解为用来连接数据库的类. 工作流程 ①Connection对象用来连接数据库. 两种连接方式:Windows身份验证 / sqlserver验证 private ...
- 如何调用common.js
第一步 页面需要引用此js 第二步 var loginJs = { //登录 goLogin: function () { var _userinfo = { name: "夏小沫" ...
- vue elementUI enter 回车 (转载)
表单提交时需要处理输入框的回车事件 一.vue原生 原生input标签可以用@keyup.enter="onSubmit" 如:<input v-on:keyup.enter ...
- MyBatis学习笔记(二) Executor
一.概述 当我们打开一个SqlSession的时候,我们就完成了操作数据库的第一步,那MyBatis是如何执行Sql的呢?其实MyBatis的增删改查都是通过Executor执行的,Executor和 ...
- wepy框架须知
安装脚手架 . 安装构件工具 npm i wepy-cli -g .创建项目 wepy new 项目名 .实时编译 wepy build --watch 或 npm run dev .使用微信开发者工 ...
- C# 任务 数据加载不影响其他操作
private void button1_Click(object sender, EventArgs e) { //this.timer1.Enabled = true; Task t1 = new ...
- react-conponent-todo
<!DOCTYPE html> <html> <head> <script src="../../build/react.js">& ...
- Atom插件安装及推荐
简介(了解更多去google或baidu) Atom 代码编辑器支持 Windows.Mac.Linux 三大桌面平台,完全免费,并且已经在 GitHub 上开放了全部的源代码.在经过一段长时间的迭代 ...
- pyinstaller使用错误 SyntaxError: Non-UTF-8 code starting with '\xb4' in file C:......
注:我的博客原本在CSDN,现转到博客园,图片采用以前的图片,并没有盗图. 在将.py文件打包时,出现了下列错误 >>C:\Users\小呆\PycharmProjects\pycha ...