appvue一直loading安卓兼容性

Posted 2023-03-15

首先在index.html中加入这三句：
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,IE=IE9">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
　　一：若在项目中使用了ES6 promise对象，在Chrome、Safari浏览器下可以正常运行，但在360兼容模式、IE内核中不支持。
　　安装依赖：npm install es6-promise -S // 下载插件
　　在main.js中引入：require('es6-promise').polyfill()

　　或者

1 import Es6Promise from 'es6-promise'
2 Es6Promise.polyfill()
　　二：用于对ES6新语法不支持的浏览器

　　安装依赖：npm install babel-polyfill -S

　　在main.js中引入：import "babel-polyfill"，放在最顶部，确保全面加载

　　更改 webpack.base.conf.js 文件中的入口 entry：

1 entry:
2 app: ["babel-polyfill", "./src/main.js"] //为低版本系统配置
3 //app: './src/main.js' //旧配置
4 ,
重新打包发布，问题解决。

【补充拓展】IE浏览器中，以上方法设置后，依然会有报错，还需要把es6转es5

　　参考：https://blog.csdn.net/qq_24985715/article/details/93764818?utm_medium=distribute.pc_relevant.none-task-blog-baidujs_baidulandingword-2&spm=1001.2101.3001.4242

　　转换语句：npm i babel-preset-es2015 -s
　　并且在项目的根目录下，修改.babelrc的内容，添加'es2015'
　　
　　安装 npm i classlist-polyfill,并且在base.config.js中，添加'classlist-polyfill'
　　app: ["classlist-polyfill","babel-polyfill", "./src/main.js"] 以上操作不一定非要使用，可以尝试下面的操作

　　关于IE浏览器中vue用axios跨域请求接口，报错列表中不存在请求标头，此问题就是出现android9或者其他手机版本调用接口失败，状态码为0的原因，解决此问题后，兼容性问题基本就都解决 参考技术A 一个月之前项目中遇到一个安卓手机低版本兼容的问题，当时以为是代码写的有问题，各种排查，最终得出的结论是安卓部分低版本手机不兼容vue。下面我就简单描述下我遇到的问题以及解决方法，以供大家参考：

问题：vue写的移动端项目，部分低版本安卓手机出现，白屏，以及页面数据渲染不完整。

原因：安卓低版本手机是不支持ES6语法的，还有少部分低版本安卓不支持小部分的ES5语法，因此vue使用的是ES6语法，所以会导致页面渲染问题。