Vue项目在ie浏览器显示空白解决方法（安装babel-polyfill ）

最新推荐文章于 2021-12-11 10:22:36 发布
原创 最新推荐文章于 2021-12-11 10:22:36 发布 · 1k 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue

本文介绍如何通过安装babel-polyfill并配置Webpack，解决Vue项目在IE浏览器下显示空白的问题，实现跨浏览器兼容。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

问题描述：

使用vue-cli脚手架搭建的项目，【npm run dev】运行，在chrome下显示正常，但是在ie下显示空白，无法打开页面。
在这里插入图片描述

文章目录

二、使用步骤

1.安装babel-polyfill

npm install babel-polyfill --save-dev

2.在【main.js】中引入babel-polyfill

import 'babel-polyfill';

3.在【webpack.base.conf.js】中找到【entry】，修改配置如下：

 entry: {
    app: ["babel-polyfill", "./src/main.js"]
  },
vue项目在IE下出现空白
weixin_39066827的博客
04-25 3028
vue项目中遇到IE浏览器开发是空白页，并未按路由加载组件。 原因 Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API ，比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise 等全局对象，以及一些定义在全局对象上的方法都不会转码。解决这个问题，我们使用 Polyfill（代码填充，也可译作兼...
记录：vue中使用axios添加了babel-polyfill和es6-promise在ie下依然app.js报错页面一片空白的解决办法
qq_30068989的博客
11-20 4879
最近一个vue开发的项目，事先已经兼容ie9+，但是最后写完整个项目后chrome，firefox下完美运行，可是用ie的时候却一片空白？？？？？网上找了很多方法都是已经做好的ie兼容babel-polyfill、es6-promise。但是为什么还是不行？？ 好吧点进去看看 => 最后一行看到了是在自己写的请求文件mainPublic.js里出问题了，去看了一下代码 发现原来是axio...
快速解决Vue项目在IE浏览器中显示空白的问题
12-08
vue项目在IE浏览器中显示空白，是因为js文件没有加载，需要引入babel-polyfill这个东西，而用vue脚手架搭建的项目是没有引入此工具的 引入方法： 打开packge.json，在dependencies中加入：”babel-polyfill” : “^6.23.0” 然后重新npm install 在App.vue文件中import：import  “babel-polyfill” 这样IE浏览器就显示正常了。 以上这篇快速解决Vue项目在IE浏览器中显示空白的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持软件开发网。
vue项目在IE下显示空白打不开问题
a378113472的博客
10-09 1030
近期遇到了项目是vue做的，在IE浏览器下打不开，显示空白问题，解决方案如下： 打不开的原因是因为少了babel-polyfill处理器，所以第一步需要下载： npm install babel-polyfill --save-dev 第二步在package.json文件中显示： 第三步引入babel-polyfill： 在main.js文件中引入babel-polyfill，也就是加一行： i...
Vue 做的项目在IE下面打开一片空白解决方法
w36680130的博客
08-20 162
Vue 做的项目在IE下面打开一片空白解决方法
vue项目安装babel-polyfill后，在IE下打开页面依然空白的问题解决方案
热门推荐
zhangqiangzgz的专栏
03-11 1万+
最近手头的vue项目需要兼容IE，正常安装babel-polyfill并进行相应的配置后，IE浏览器打开页面依然空白。 后续又安装了babel-preset-stage-2，调试了很久，结果依然不管用。后来我在webpack.base.conf.js文件中发现了一个babel-loader的配置，默认是没有绿圈中的配置的，这是后续加的，加上这个配置就好了，IE浏览器下就可以正常访问页面了。原...
Vue兼容IE报错：Babel-polyfill解决策略
报错的主要原因是IE浏览器缺少对某些ES6新对象和方法（如Promise、String.padStart）的支持。为了解决这个问题，文档推荐使用Polyfill技术，即兼容性补丁。Polyfill通过在目标环境中提供缺失的功能，使得这些新特性...
Vue2.0 IE兼容解决方案：babel-polyfill的必要步骤
当在使用Vue 2.0开发的项目中遇到在Internet Explorer (IE) 下面打开一片空白的问题时，这通常是因为IE浏览器不支持某些JavaScript特性，Vue 2.0的一些新功能可能在旧版本的浏览器中未被兼容。Vue框架本身并不强制...
Vue 2.0在IE11中打开项目页面空白的问题解决
linpenghui958的博客
08-17 6213
在IE11中打开vue项目报错 原因是 Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API ，比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise 等全局对象，以及一些定义在全局对象上的方法（比如 Object.assign）都不会转码。为了解决这个问题，我们使用一种叫做 Polyfil
解决vue项目在IE浏览器下运行空白
qq_43075191的博客
12-11 2931
问题1：vue项目在IE11下一片空白 原因： ·IE浏览器解析不了es6的语法，需要使用babel。但是Babel 默认只转换新的 JavaScript 句法（syntax），而不转换新的 API ，比如 Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise 等全局对象，以及一些定义在全局对象上的方法（比如 Object.assign）都不会转码。 解决： 1.在vue项目中安装babel-polyfill npm install --save-
vue项目兼容ie浏览器的问题：在其他浏览器显示都是正常的，在ie下显示空白
vip.khan的博客
05-28 3214
1、安装babel-polyfill npm install babel-polyfill --save-dev 2、main.js中引入 import 'babel-polyfill' 3、webpack.base.conf.js文件里修改代码如下 module.exports = { entry: { app: ["babel-polyfill", "./src/main.js"...
vue项目兼容IE浏览器之在ie浏览器出现空白页
weixin_44962808的博客
12-28 369
vue项目在IE下出现空白，读不出数据的情况。还有一些ES新语法不兼容问题的处理。 一、使用vue-cli创建项目 1、在vue项目中使用 npm 安装babel-polyfill npm install --save-dev babel-polyfill 2、在mian.js中引入babel-polyfill（在引入vue、vuex之前引入） import 'babel-polyfill' ...
Vue进阶（七十六）：vue项目在IE下显示空白打不开问题
IT全栈 华强工作室
09-18 2132
解决方法：安装 “babel-polyfill” 1、命令：npm安装 npm install --save-dev babel-polyfill 或 cnpm install --save-dev babel-polyfill 2、在入口main.js文件引入：import 'babel-polyfill'，放页面顶部最好。 3、在build文件夹下找到webpack.base.conf.js...
babel-polyfill解决vue框架项目IE无法打开问题
Alice
10-25 1483
babel-polyfill解决vue框架项目IE无法打开问题vue框架webpack打包原因解决方法 vue框架webpack打包 vue-cli搭建了一套vue的开发框架，webpack打包发布后，Chrome可以正常打开，但是IE无法打开。 原因 ie9和一些低版本的IE浏览器不支持es6新语法 解决方法 安装babel-polyfill组件 ： npm install --save-dev...
vue项目中正确引用babel-polyfill后在IE中仍然无效，显示空白页的原因及解决方案
Mr_CZL的博客
05-13 1万+
最近用vue开发项目，在git上直接拉取了一个vue-admin-template模板。 然而该模板作者明确表明没有兼容IE，如果需要，自己安装babel-polyfill。 由于本项目还是会考虑高版本IE的兼容，所以安装了babel-polyfill，并正确引用了，（安装和引用方法略，网上很多，至于引用方法1.在entry处引用。2.在main.js处import引用。经测试都是有效的，引用...
vue项目兼容IE浏览器，页面空白
weizhiyuan20的博客
05-14 397
解决方案： 1、安装 babel-polyfill 包 npm installbabel-polyfill --save-dev 安装成功后在package.json文件中会有 2、在main.js文件中导入 import "babel-polyfill" 3、在项目下新建文件 .babelrc .babelrc内容： { "presets": [ ["env", { "modules": false, "targets": { "br.
解决vue项目在IE浏览器打开空白问题
qq_41395120的博客
05-21 3429
vue项目运行编译，发现在IE浏览器一片空白，解决方法： 1、安装babel-polyfill： npm install babel-polyfill --save-dev 2、在main.js文件中引入：import'babel-polyfill' 3、在webpack.base.config.js中将entry中的app:./src/main.js'改为下面格式 entry:{ app:['babel-polyfill','./src/main.js'] }, 4、重新...
vue项目兼容IE浏览器
cxu123321的博客
12-24 215
vue项目兼容IE浏览器 原创xm2by 发布于2018-08-17 11:04:56 阅读数 11996 收藏 展开 vue项目兼容IE浏览器 利用vue-cli脚手架搭建的项目打包后在chrome下正常显示，IE浏览器下显示空白，这是因为缺少babel-polyfill处理器的缘故。 vue-cli脚手架构建的项目结构： 解决方法： 1、安装babel-polyfill包； npm ...
vue项目在IE内核下打开显示白屏（已解决）
weixin_49357306的博客
12-15 1406
最近在开发vue项目遇到的一个问题，就是在浏览器兼容模式下打不开，浏览器显示空白页面，找了好久才解决了，下面是我解决的方法，感觉有用的给点个赞收藏一波哦！ vue项目在IE内核下打开显示白屏（已解决） 一.安装babel-polyfill库 npm install --save babel-polyfill 二.在main.js中引入(最好放在最上面) import '@babel/polyfill'; 二.在vue.config.js中加入 transpileDependencies: process
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值