vue在IE和360兼容模式下无法显示问题

2024-04-17 11:57:32

360兼容模式下报错：[vuex] vuex requires a Promise polyfill in this browser.

原因：

360浏览器中包含了两个浏览器
一个是IE（Trident内核），即兼容模式，在使用网银时需要切换为兼容模式
一个是Chrome（Chrommium内核），即极速模式，普通浏览时使用

Chrome：51 版起便可以支持 97% 的 ES6 新特性。
Firefox：53 版起便可以支持 97% 的 ES6 新特性。
Safari：10 版起便可以支持 99% 的 ES6 新特性。
IE：Edge 15可以支持 96% 的 ES6 新特性。Edge 14 可以支持 93% 的 ES6 新特性。（IE7~11 基本不支持 ES6）

babel-polyfill

babel-polyfill 是针对全局环境的，引入它浏览器就好像具备了规范里定义的完整的特性，一旦引入，就会跑一个 babel-polyfill 实例。用法如下：

1.安装 babel-polyfill

npm install babel-polyfill --save

2.在入口文件中引用：

import 'babel-polyfill'

针对ES6的兼容性问题，很多团队为此开发出了多种语法解析转换工具，把我们写的ES6语法转换成ES5，相当于在ES6和浏览器之间做了一个翻译官。比较通用的工具方案有babel，jsx，traceur，es6-shim等。

法一：webpack.base.conf.js中配置

entry: {

app: ["babel-polyfill","./src/main.js"],

}

entry: {

app: "./src/main.js",

"babel-polyfill":"babel-polyfill"

}

法二：在main.js中引入

import 'babel-polyfill'

但上述方法都未生效！

本人亲测下列两种方法可行：

法一：webpack.base.conf.js中配置

entry: {
// "babel-polyfill"用来解决的兼容性
app: ['./node_modules/babel-polyfill/dist/polyfill.js','./src/main.js']
}

法二：

直接引入：

<script src="https://cdn.bootcss.com/babel-polyfill/6.23.0/polyfill.min.js"></script>

vue在IE和360兼容模式下无法显示问题相关推荐

解决vue项目在ie和360兼容模式下显示空白页问题
艰难路程记一次bug解决,项目不复杂,是一个基于vue-cli3搭建的pc端项目,之前开发都是在谷歌浏览器上运行的,但在开发进入到后半段,经理说,项目需要在360兼容模式下展示,这时候发现项目在36 ...
解决vue项目在ie、360兼容模式下空白页面问题
完美解决vue项目在ie.360兼容模式下空白页面,并提示语法错误的原因艰难路程解决办法艰难路程事实上,很多人在做项目的过程中很多存在同一个问题,于是去百度了,但是用同样的解决方法不一定就能解 ...
vue 项目、vue-admin-ement项目在IE、360兼容模式下为空白界面（最新解决方法、亲测有效）
问题由于对element ui模板的一些配置文件进行删除,配置的js只留下vue.config.js剩余的都进行清除, 导致在IE以及360兼容模式下界面为空白思路控制台报的是SCRIPT100 ...
360浏览器兼容模式下页面显示异常（出现不改出现的HTML标签）
在360浏览器的兼容模式下,显示了在非兼容模式中没有出现的HTML标签,如下图我到对应的页面去找,发现是标签的代码规范问题,这两个input本来是隐藏的,但是由于不规范书写(hidden处),在万恶 ...
解决360 兼容模式下问题。
最近用360浏览器访问自己的网站,发现都是被优先选用兼容模式打开,这使得网站很难看.为了让360浏览器打开网站的时候优先试用极速模式,找了一下官方论坛,发现了解决方案. 在head标签中添加一行代码: ...
解决360 兼容模式下问题
最近用360浏览器访问自己的网站,发现都是被优先选用兼容模式打开,这使得网站很难看.为了让360浏览器打开网站的时候优先试用极速模式,找了一下官方论坛,发现了解决方案. 在head标签中添加一行代码: ...
360浏览器 ajax取缓存,Angularjs在360兼容模式下取数据缓存问题的解决办法
测试提了一个bug,在360浏览器兼容模式下,删除页面数据需要手动刷新浏览器才能看到最新的数据.首先要复现当时的问题,很容易就复现了,但是发现在360浏览器兼容模式下无法打开开发者工具.好在经过反复重 ...
360浏览器兼容模式下站点显示不正常，极速模式正常
1.可能跟客户端浏览器设置有关,因为360兼容模式使用的是IE内核,所以要排查IE相关设置(重点:安全站点) 2.可能是脚本或样式中不兼容语法,比如ES6,需要修改脚本或样式特此记录一下!!!!!!
360兼容模式下对象不支持“attachEvent”属性
在360模式下,js程序中报对象不支持"attachEvent"属性报错代码如下: if (window.VBArray && window.addEventL ...

最新文章

热门文章