vue cli3 兼容ie8以上浏览器，前端兼容；解决ie浏览器下白屏问题

缺乏、安全感 2021-09-01 04:20 783阅读 0赞

1下载 babel-polyfill 模块

npm install babel-polyfill -s

2入口文件（main.js）第一行引入

import "babel-polyfill";
    import Vue from 'vue'
    import App from './App.vue'
    import router from './router'
    import store from './store'
    import Button from 'ant-design-vue/lib/button';
    import Antd from 'ant-design-vue'
    import 'ant-design-vue/dist/antd.css';
    import zh_CN from 'ant-design-vue/lib/locale-provider/zh_CN';
    import moment from 'moment';
    import 'moment/locale/zh-cn';
    import './assets/iconfont/iconfont';
    import axios from 'axios'
    
    Vue.component(Button.name, Button);
    
    Vue.config.productionTip = false
    
    Vue.use(Antd)
    // Vue.use(axios)
    
    moment.locale('zh-cn');
    new Vue({ 
      zh_CN,
      router,
      store,
      render: h => h(App)
    }).$mount('#app')

3.配置 polyfill，在根目录下新增babel.config.js文件：

module.exports = { 
    	presets: [
    		['@vue/app', { 
    			useBuiltIns: 'entry'
    		}]
    	]
    }

原来有此文件就直接修改

module.exports = { 
      presets: [
        // '@vue/cli-plugin-babel/preset', //文件原始内容
        ['@vue/cli-plugin-babel/preset', { 
          useBuiltIns: 'entry'             //添加的内容
        }]
      ]
    }

4.如果设置了以上配置，还是白屏，看是不是[兼容性视图][Link 1]问题

[Link 1]: https://blog.csdn.net/i_am_a_div/article/details/109055668

发表评论取消回复

表情：

评论列表（有 0 条评论，783人围观）

还没有评论，来说两句吧...

相关阅读

相关【vue项目兼容ie浏览器问题】

由于IE缓存机制的问题，首次执行ajax的URL，进行缓存，再执行时，同一URL地址，不会在变化。解决方法：创建动态的URL地址。给ajax的请求url一个假的动态路径，从

Bertha 。/ 2023年10月09日 12:27/ 0 赞/ 51 阅读

相关 vue-cli3项目在IE浏览器白屏兼容问题

1.安装支持 npm install --save babel-polyfill npm install es6-promise --save 2

谁借莪１个温暖的怀抱￠/ 2022年12月01日 01:13/ 0 赞/ 188 阅读

相关 ie浏览器兼容——scrollTop

ie浏览器兼容——scrollTop ![在这里插入图片描述][20210316114528314.png] 报错 ![在这里插入图片描述][2021031611

以你之姓@/ 2022年11月10日 03:59/ 0 赞/ 318 阅读

相关 vue项目兼容ie浏览器

1、问题 vue项目在ie浏览器下，会报Symbol 未定义的错，还有其他一些es6-10中出现的新的语法不兼容的问题 2、解决方法安装babel-polyfi

淩亂°似流年/ 2022年11月04日 00:58/ 0 赞/ 254 阅读

相关 ie浏览器兼容

ie低版本浏览器默认很多标签是自带样式的。 ul默认室友padding-left 40px li标签的默认样式是跟其他浏览器不一样的。默认情况下，Firefox中lis

灰太狼/ 2022年07月16日 00:45/ 0 赞/ 331 阅读

相关 ie浏览器兼容笔记

ie低版本浏览器默认很多标签是自带样式的。 ul默认室友padding-left 40px li标签的默认样式是跟其他浏览器不一样的。默认带有左边距16

逃离我推掉我的手/ 2022年07月13日 00:19/ 0 赞/ 323 阅读

相关 Vue项目兼容IE浏览器

Vue项目部署到服务器后，通常除IE浏览器外其他都正常，而IE浏览器会报这么个问题 ![这里写图片描述][SouthEast] 因为Vue使用了ES6 Promise，而I

绝地灬酷狼/ 2022年06月09日 01:28/ 0 赞/ 412 阅读

相关 IE等浏览器兼容

一、IE： $('.box').css({ display: 'block' }); 'block’不能有空格，'block '会没有效果二、IE10及以下：

忘是亡心i/ 2022年02月03日 12:29/ 0 赞/ 360 阅读

相关 vue cli4 兼容IE浏览器

Babel是一个JavaScript编译器 -------------------- Babel是一个工具链，主要用于将ECMAScript 2015+代码转换为当前和

秒速五厘米/ 2021年11月27日 03:52/ 0 赞/ 755 阅读

相关 vue cli3 兼容ie8以上浏览器，前端兼容；解决ie浏览器下白屏问题

1下载 babel-polyfill 模块 npm install babel-polyfill -s 2入口文件（main.js）第一行引入 impor

缺乏、安全感/ 2021年09月01日 04:20/ 0 赞/ 784 阅读