Explicar en detalle los problemas de compatibilidad en el desarrollo de proyectos usando VueJS

Este artículo proporciona un resumen detallado de los problemas de compatibilidad encontrados en el proyecto Vue y las soluciones .

Primero, los proyectos de VUE generalmente usan axios, y axios se basa en promesas, por lo que cualquier versión de IE no lo admite (el kernel trident no funciona)

Solución uno:

/*ie兼容 Promise*/
 isIE();
 function isIE() {
    
     //ie?
     if ( !! window.ActiveXObject || "ActiveXObject" in window) {
    
    
         var script = document.createElement("script");
         script.type = "text/javascript";
         script.src = "/js/unity/bluebird.js";
         document.getElementsByTagName('head')[0].appendChild(script);
     }
 }
 /*ie兼容 Promise end*/

Solución dos (babel):
específica: https://blog.csdn.net/weixin_46034375/article/details/107926680

1. Instale el paquete de dependencia babel-polyfill: npm install babel-polyfill --save
2. Haga referencia a él en mian.js del proyecto vue:import 'babel-polyfill'

1. 安装babel-polyfill 执行以下命令，重启服务器：
npm install --save babel-polyfill

2.在main.js引入
import 'babel-polyfill'

3.在webpack.base.conf.js中配置:
entry: {
    
    
    app: ['babel-polyfill','./src/main.js']
},

Solución 3: VueJS genera el problema de la promesa indefinida en IE

//安装promise
$ npm install es6-promise --save-dev
2. 引用并调用
在main.js文件：

import promise from 'es6-promise'
promise.polyfill()

2. IE no admite funciones de flecha

solución:

①Puede instalar el complemento,
②No use la función de flecha, use la función de función directamente, solo var that = this para referirse a esto

En tercer lugar, esto no puede apuntar a la instancia de vue en la función de devolución de llamada asincrónica

Solución: cambie la función de función a una función de flecha

4. Resolver el problema del retraso de 3 segundos en la activación de eventos de clic en algunas versiones de navegadores móviles.

· Instale el paquete de dependencia fastclick :npm install fastclick --save-dev

· Enlace fastclick al cuerpo en Main.js del proyecto Vue:

　import fastClick from 'fastclick'
  fastClick.attach(document.body)

Cinco, estilo CSS

Borrar el estilo inicial de CSS: reset.css
resuelva el problema del borde de 1px de 2x y pantallas múltiples : border.css
Nota: Estos archivos CSS se pueden encontrar en la búsqueda de Baidu