vue检测是不是360浏览器兼容模式_Vue项目 IE/360浏览器兼容模式下打开空白的问题...

记一次bug解决

bug发现

项目不复杂,就是一个基于vue-cli3搭建的pc端项目

在开发进入后半段的时候发现在360浏览器兼容模式先显示空白而且没有报错,此类问题之前我写react在低版本的qq浏览器上也遇到过,因为当时写的是移动端项目也就没在意

网上搜索找到的答案几乎都是Promsie的兼容问题,给出的解决方案是babel-polyfill,script标签引入也好,main.js引入也好,都没有效果(因为他本身就没报Promsie的错 有效果就有鬼啦)

demo测试

我用cli新建了一个demo,发现在兼容模式下可以正常打开

这就奇怪了 所以应该不是vue的语法问题,所以我把问题联想到了iview

大部分组件和功能支持 IE9 及以上浏览器，部分组件和功能不支持 IE

我用vue-cli-plugin-iview加入了iview之后 果然在兼容模式下打不开了 , 我开始寻找相关的解决办法 很快在github上找到了这个issues

在vue.config.js中加入transpileDependencies: ['iview']即可 此时demo可在360兼容模式中正常打开

transpileDependencies 这一配置可以再vue cli的文档中找到

默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel >显式转译一个依赖，可以在这个选项中列出来。

项目仍然空白

这就很尴尬,有点没头绪 因为他不报错...

直到我打开F12的情况下点击刷新 报错了: SCRIPT1002:语法错误

然后一点开 完全看不懂...