vue 项目在 IE11 里呈现空白，不兼容的问题解决方案

我用vue 2.6.11版本编写的项目，在谷歌浏览器上运行的好好地，但是放到ie11浏览器上却是一片空白。

这个问题遇到的时候，我是蒙蔽了，抓紧去搜了搜百度，百度上的答案倒是都很统一。

都是说ie不兼容，解决方案都是千篇一律

1、在vue项目中安装babel-polyfill
    npm install --save-dev babel-polyfill

2、mian.js中引入babel-polyfill
    import 'babel-polyfill';

3、在build文件夹中webpack.base.conf.js将

//entry: {
// app: ‘./src/main.js’
// },
替换为
entry: {
app: [‘babel-polyfill’, ‘./src/main.js’]
},

前两步都还好说，第三部我没找到webpack.base.conf.js这个文件了。

在群里问大佬，大佬说是我没在安装脚手架的时候选择，但是我记得我选择了，但是却依旧没有。

后来，我继续翻阅相关资料博客

在 https://juejin.cn/post/6844903816043692040  中找到了跟我一样的问题。

从而我得知道了可能是我用的swiper的原因造成的。

于是乎我搜索了一下错误码     SCRIPT1002:语法错误

得知出现这个错误码时是以下几个方面的原因：

1. 可能与IE的某些插件冲突。请把所有无关的IE加载项全部禁用后尝试

2. 引用了不存在的js文件

3. 页面的某些文件在文档模型还没建立时就已经开始引用相关的节点

最后看来看去，发现还是 轮播插件swiper 中的一些最新版本 不支持ie ，还是兼容问题的锅

所以只能将swiper 版本降级

cnpm install swiper@3.4.2 --save

将swiper 降级到3.4.2 就能正常显示了

奥对了，别忘了更改引入时的路径，不然项目可启动不起来哟~

import 'swiper/dist/css/swiper.css';

----------------------------------

当然我从5.x版本降到3.4.2版本，导致swiper用的时候，分页器的小点点没有了。这是因为版本变低了，于是乎我去翻阅swiper的api文档

按着文档来进行适当的修改，

然后就OK了。。。