How to solve the incompatibility prompt of vue ie8-Front-end Q&A-php.cn

How to solve the incompatibility prompt of vue ie8

藏色散人

Release： 2023-01-29 10:20:08

Original

1690 people have browsed it

Vue ie8 incompatible solutions: 1. Use "babel-polyfill" to convert ES6 syntax to ES5; 2. Introduce "es6-promise"; 3. Prompt to upgrade the browser or pass "(function (w){if(!("WebSocket" in w&&2===w.WebSocket.CLOSING)){...}" Just jump to the upgrade.

How to solve the incompatibility prompt of vue ie8

The operating environment of this tutorial: Windows 10 system, Vue version 3, DELL G3 computer

How to solve the incompatibility prompt of vue ie8?

Solution to Vue A simple way to be compatible with lower version browsers

Vue does not support IE8 and below because Vue uses ECMAScript 5 features that IE8 cannot emulate. But it supports all ECMAScript 5-compatible browsers. Use Vuex When working with axios, browser support is required: Promise, but IE does not support Promise.

Tip: If the project needs to support IE users, it is not recommended to use Vue to build.

How to use Vue to support more Browser version?

Method 1. Babel-polyfill simulates ES2015

Use babel-polyfill to convert ES6 syntax to ES5 and simulate the entire ES2015 environment. You can use Promise and WeakMap. Methods Array.from, Object.assign, Array.prototype.includes.

npm install --save babel-polyfill
require("babel-polyfill");
import "babel-polyfill";

Copy after login

Method 2, es6-promise supports Promise

npm install es6-promise
require(&#39;es6-promise&#39;).polyfill();

Copy after login

Tip: Although these polyfills meet some needs, they are invisible Increased the size of the project.

Method 3, Tips for lower version browsers

Compatibility with lower version browsers is a painful thing in itself, and IE browser has basically become a thing of the past , if too much work is done to be compatible with these browsers, it is really a waste.

It is also a good way to prompt users to upgrade their browsers. Recommended website: Happy browsing.

Happy Browsing: Provide commonly used browser downloads, including Google, Firefox, 360 Browser, etc. Add the following Js code to the public\index.html file in the VUE project:

Prompt to upgrade browser

(function(w){if(!("WebSocket"in w&&2===w.WebSocket.CLOSING)){var d=document.createElement("div");d.className="browsehappy";d.innerHTML=&#39;<div style="width:100%;height:100px;font-size:20px;line-height:100px;text-align:center;background-color:#E90D24;color:#fff;margin-bottom:40px;">\u4f60\u7684\u6d4f\u89c8\u5668\u5b9e\u5728<strong>\u592a\u592a\u65e7\u4e86</strong>\uff0c\u592a\u592a\u65e7\u4e86 <a target="_blank" href="http://browsehappy.osfipin.com/" style="background-color:#31b0d5;border-color: #269abc;text-decoration: none;padding: 6px 12px;background-image: none;border: 1px solid transparent;border-radius: 4px;color:#FFEB3B;">\u7acb\u5373\u5347\u7ea7</a></div>&#39;;var f=function(){var s=document.getElementsByTagName("body")[0];if("undefined"==typeof(s)){setTimeout(f,10)}else{s.insertBefore(d,s.firstChild)}};f()}}(window));

Copy after login

Jump directly

(function(w){if(!("WebSocket"in w&&2===w.WebSocket.CLOSING)){w.location.replace("http://browsehappy.osfipin.com/");}}(window));

Copy after login

Generally speaking, there are basically very few IE users at present. There is no need to make many compromises to be compatible with IE users. Perhaps forcing users to upgrade their browsers is a good option.

Recommended learning: "vue video tutorial"

The above is the detailed content of How to solve the incompatibility prompt of vue ie8. For more information, please follow other related articles on the PHP Chinese website!