vue项目在IE中遇到的坑(页面空白，某个路由空白问题，swiper报错，图片无法解析)-蒲公英云

vue项目在IE中遇到的坑(页面空白，某个路由空白问题，swiper报错，图片无法解析)

vue项目中经常遇到的问题

IE中无法解析es6或者版本更高的语法

需要安装babel将高版本语法转化为ES5语法

安装babel

npm install --save-dev babel-polyfill

main.js中引入

import 'babel-polyfill'

vue.config.js中

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

某个路由无法跳转

ie中路由配置中不能出现重复，假设配置了

{
     path: '/',
     name: 'homePage',
},{
     path:'*', //全不匹配的情况下,跳转到homePage页面
     name: 'homePage',
}

swiper报错

遇到swiper报错的时候搜索到好多说是swiper版本太高导致的，但是降低版本后并没有作用（可以先尝试降低版本到3.4.2）

node_modules文件夹下的不参与编译，筛查之后发现是swiper包里有es6语法

最后发现是引入问题，我们一般引入的时候是

import swiper from 'swiper';

改成下面这种

import swiper from 'swiper/dist/js/swiper.js';

图片无法解析

IE中图片一般无法解析是因为图片原本格式被改变了，比如将jpg格式改为png，就会无法解析，暂时没找到好的解决办法，只能保留图片原本格式来搞定

vue项目在IE中遇到的坑(页面空白，某个路由空白问题，swiper报错，图片无法解析)