排查一:
先看看项目中是否安装并引入babel-polyfill这个东西,(Babel是一个广泛使用的转码器,可以将ES6代码转为ES5代码)。引入则跳过
vue项目在IE浏览器中显示空白,是因为js文件没有加载,需要引入babel-polyfill这个东西,而用vue脚手架搭建的项目是没有引入此工具的
引入方法:
(1)安装 npm install --save babel-polyfill
(2)修改 webpack.base.conf.js
app: ['babel-polyfill', './src/main.js']
(3)在main.js中引入 import 'babel-polyfill'
正常情况下应该是可以的,毕竟大多数人成功了,而我是特例,最终还是空白不显示
排查二:
检查插件是否不兼容ie
我重新新建了一个vue2的项目空架子,运行在ie中是可以显示的,是vue的Helloworld页面,包含vue大logo的页面,很明显是可以显示的,而将我的页面以及main.js以及静态文件以及package.json文件放进去之后就还是空白。
后来我发现这样还是解决不了问题,就开始一个页面一个页面的加进去,并把用到的插件一个一个添加到main.js里面,当我添加到vuex的store文件的时候,页面不出来了。
因此就在想可能是vuex导致的,vuex本身对ie没有兼容性,难道是用了什么插件导致的吗。
后来打开store文件下的index.js文件找到了所用的插件,让vuex持久化保存的插件。
注释掉的就是vuex-persist,导致了页面空白。原来是vuex-persist不兼容ie......
之后上网找出了替代它的插件vuex-persistedstate,然后进行安装使用。
vuex-persistedstate安装方法参考:vuex-persist不兼容IE的问题 - 简书
然后经过七七四十九小时才弄好~~~
心痛,以前项目从来没在ie中打开过,确实是自己的疏忽