Vue在IE下显示空白问题

主要是IE对promise的支持不好,我也是搜索后解决的,主要参考这个网站https://babeljs.io/docs/usage/polyfill/

  1. 安装 npm install --save babel-polyfill
  2. 在package.json中添加依赖,
  3. devDependencies:{

    "babel-polyfill": "^6.22.0"

    }

  4. 在app.vue中添加引用“import ‘babel-polyfill‘”
  5. 在webpack.config.js文件中使用

module.exports = {
     entry: {
     app: ["babel-polyfill", "./src/main.js"]
     }

};






时间: 2024-10-08 09:56:39

Vue在IE下显示空白问题的相关文章

Vue 2.0 项目在IE下显示空白

新写的项目在 IE浏览器显示空白 解释一: Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如Iterator.Generator.Set.Maps.Proxy.Reflect.Symbol.Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)都不会转码. 举例来说,ES6在Array对象上新增了Array.from方法.Babel就不会转码这个方法.如果想让这个方法运行,必须使用babel-polyfill,为当前环

webpack使用vue-moment-libs 在PC微信浏览器下显示空白

在chrome或者手机端,web应用显示正常,但在PC微信端不能显示,空白的. 通过测试IE9版本,也是显示空白的. 网络上说是PC微信浏览器不支持语法糖 ()=>{}  但是我看我这边是因为我使用了vue-moment-lib组件,这个组件生成的错误语句如下图 这个时候ES6的语法,IE9不支持,PC端也应该是IE9的内核. 最终解决:后来我是因为把moment改为了dayjs,所以解决了问题. 说说我是怎么定位到vue-moment-lib组件的锅的. 在IE中显示的错误是 点击保存的那行,

web标准:img图片在ie6下显示空白的bug解决方案

在进行页面的DIV+CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对于该问题的解决方法也是“见机行事”. 1.将图片转换为块级对象 即,设置img为“display:block;”.在本例中添加一组CSS代码:“#sub img {display:block;}”. 2.设置图片的垂直对齐方式 即设置图片的vertical-align属性为“top,text-top,bottom,text-bottom”也可以解决.如本例中增

Img图片在IE6下显示空白的Bug解决方案

在进行页面的DIV+CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对于该问题的解决方法也是“见机行事”. 1.将图片转换为块级对象 即,设置img为“display:block;”.在本例中添加一组CSS代码:“#sub img {display:block;}”. 2.设置图片的垂直对齐方式 即设置图片的vertical-align属性为“top,text-top,bottom,text-bottom”也可以解决.如本例中增

vue history模式下出现空白页情况

问题描述:   vue搭建的项目,路由一直用的hash模式,所以url中都会带有一个“#”号.现在想要去掉“#”,于是使用history模式 { mode: 'history' },代码如下: import Vue from 'vue'; import App from './App'; import routers from './router'; import VueRouter from 'vue-router'; Vue.use(VueRouter); const router = ne

vue打包后显示空白正确处理方法

在项目中很多时候需要用到vue打包成html不需要放在服务器上就能浏览.根据官网打包出来的html直接打开是显示空白. 正确的方法步骤是 1.找到配置文件 修改 这样打包处理可以打开但是页面样式会找不到 2.修改 找到对应的位置加上publicPath: '../../' 然后就成功了! 转载:http://www.wei86.cn/article/1/cid/3.html

img图片元素下多余空白解决方案

在进行页面的DIV+CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对於 该问题的解决方法也是「见机行事」,根据原因的不同要用不同的解决方法,这里把解决直接把解决image图片布局下边的多余空隙的BUG的常用方法归纳, 供大家参考.1.将图片转换为块级对像即,设置img为:display:block;在本例中添加一组CSS代码:#sub img {display:block;}2.设置图片的垂直对齐方式即设置图片的vertica

img标签下多余空白BUG解决方法

在进行页面的DIV CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的 对于该问题的解决方法也是“见机行事”. 1.将图片转换为块级对象 即,设置img为“display:block;”.在本例中添加一组CSS代码:“#sub img {display:block;}”. 2.设置图片的垂直对齐方式 即设置图片的vertical-align属性为“top,text-top,bottom,text-bottom”也可以解决.如本例中

解决图片元素下多余空白的BUG

1.将图片转换为块级对象     即,设置img为"display:block;".在本例中添加一组CSS代码:"#sub img {display:block;}".2.设置图片的垂直对齐方式     即设置图片的vertical-align属性为"top,text-top,bottom,text-bottom"也可以解决.如本例中增加一组CSS代码:"#sub img {vertical-align:top;}".3.设置