Ich habe enorme Probleme damit, meine Polyfills in Edge zum Laufen zu bringen. Ich habe versucht, der Dokumentation mit verschiedenen Versuchen zu folgen, die alle nicht funktionierten. Es scheint vielversprechend zu sein. Letztendlich funktioniert das nicht. Dies geschieht in einem vuex-Modul, daher habe ich versucht, vuex zu transpileDependencies in vue.config hinzuzufügen, aber ohne Glück.
Meine babel.config.js:
module.exports = {
presets: [['@vue/cli-plugin-babel/preset', {
useBuiltIns: 'entry',
}]],
};
In meiner main.js habe ich ganz oben die folgenden zwei Importe:
import 'core-js/stable';
import 'regenerator-runtime/runtime';
Meine vue.config.js
// eslint-disable-next-line import/no-extraneous-dependencies
const webpack = require('webpack');
const isProd = process.env.NODE_ENV === 'production';
module.exports = {
configureWebpack: {
// Set up all the aliases we use in our app.
plugins: [
new webpack.optimize.LimitChunkCountPlugin({
maxChunks: 6,
}),
],
},
css: {
// Enable CSS source maps.
sourceMap: !isProd,
},
transpileDependencies: ['vuex'],
};
Beachten Sie, wie oben erwähnt, habe ich sowohl mit als auch ohne die transpileDepedencies versucht. Hier steht vue / babel-preset-app , es7.promise.finally
die als Standard-Polyfill enthalten ist
Versionen:
- Microsoft Edge: 44.18
- Microsoft EdgeHTML 18.18362
- @ vue / cli-plugin-babel ":" ^ 4.1.2 "
- "core-js": "^ 3.6.4"
- "Regenerator-Laufzeit": "^ 0.13.3"
Update 13/02
Also habe ich versucht, Promise.prototype auf meiner Site in edge einzugeben, und es scheint, dass es polyfilled ist:
Derzeit untersuche ich, ob ein Teil meiner Kette (Axios / Vue Axios) kein Versprechen zurückgibt. Da es in Chrom funktioniert, vermute ich, dass ein Teil der Kette nicht richtig polygefüllt wird?
Das ist meine gesamte Kette:
/* VUEX MODULE ACTION */
[a.ALL_CUSTOMERS](context) {
context.commit(m.SET_CUSTOMER_LOADING, true);
CustomerService.getAll()
.then(({ data }) => {
context.commit(m.SET_CUSTOMERS, data);
})
.finally(() => context.commit(m.SET_CUSTOMER_LOADING, false));
},
/* CUSTOMER SERVICE */
import ApiService from '@/common/api.service';
const CustomerService = {
getAll() {
const resource = 'customers/';
return ApiService.get(resource);
},
...
}
/* API SERVICE */
import Vue from 'vue';
import axios from 'axios';
import VueAxios from 'vue-axios';
const ApiService = {
init() {
Vue.use(VueAxios, axios);
let baseUrl = process.env.VUE_APP_APIURL;
Vue.axios.defaults.baseURL = baseUrl;
},
setHeader() {
Vue.axios.defaults.headers.common.Authorization = `Bearer ${getToken()}`;
},
get(resource) {
this.setHeader();
return Vue.axios.get(`${resource}`);
},
...
}
finally()
Polyfüllung benötigen, da sie Promise seit Version 18 unterstützt*Version number used for Edge is based on the number of EdgeHTML rather than Edge itself. This is because EdgeHTML is the engine for Edge that is related to feature support change.
Antworten:
Ich habe mich jemals zuvor mit diesem Problem befasst. Nur endlich hat Edge nicht funktioniert. Ich habe endlich wie unten VVV aktualisiert und es hat funktioniert.
Dies sollte die Ausbreitung der thenable des Griff Spezies zusätzlich zu den Verhaltensweisen nachfolgend aufgeführt:
Diese Implementierung basiert auf dem dokumentierten Verhalten von finally () und hängt davon ab, dass then () der Spezifikation entspricht:
quelle
Dies ist ein bekanntes Problem in core-js .
Theoretisch bietet Edge eine Promise-Polyfüllung für schließlich, aber möglicherweise ist etwas mit der Funktionserkennung oder Ihrer Browserliste los, und Sie müssen eine Polyfüllung bereitstellen: Achselzucken:
Ich würde sowohl das Vue Babel Plugin als auch Core-Js aus Ihrem Projekt löschen und dann npm sie neu installieren.
npm install @vue/cli-plugin-babel --save-dev
npm install core-js --save
Stellen Sie außerdem sicher, dass Sie core-js @ 3 über Ihre Konfiguration (babel.config.js) hier verwenden
Schließlich gibt es einige Github-Probleme, die sich mit Polyfills + Promises in Bezug auf die anderen Bibliotheken von Drittanbietern befassen, die in Ihrem Vuex-Shop ausgeführt werden. Fügen Sie alle drei dieser Bibliotheken (Axios, Vue-Axios, Vuex) zu Ihrem
transpileDependencies
Abschnitt hinzu. Wenn dies das Problem behebt, entfernen Sie die Abhängigkeiten, um festzustellen, ob sie benötigt werden.quelle
Versuchen Sie
.browserslistrc
, Ihrem Projektstamm eine Datei mit folgendem Inhalt hinzuzufügen :Informationen zur Konfiguration finden Sie unter https://github.com/browserslist/browserslist#best-practices
last versions
.Wenn dadurch fehlende Polyfüllungen nicht behoben werden, deaktivieren Sie das verwendete Plugin, das die Anzahl der Chunks begrenzt, um sicherzustellen, dass keine Polyfüllungen weggelassen werden.
quelle