让我的polyfill在Edge中工作时遇到了很大的麻烦。我尝试了各种失败的尝试来遵循文档。这似乎是有希望的。最后特别是那是行不通的。这是在vuex模块中发生的,因此我尝试将vuex添加到vue.config中的transpileDependencies,但是没有运气。
我的babel.config.js:
module.exports = {
presets: [['@vue/cli-plugin-babel/preset', {
useBuiltIns: 'entry',
}]],
};
在我的main.js中,最顶部有以下两个导入:
import 'core-js/stable';
import 'regenerator-runtime/runtime';
我的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'],
};
Note as mentioned above I have tried both with and without the transpileDepedencies. It says here vue/babel-preset-app that es7.promise.finally
is included as a default polyfill
Versions:
- Microsoft Edge: 44.18
- Microsoft EdgeHTML 18.18362
- @vue/cli-plugin-babel": "^4.1.2"
- "core-js": "^3.6.4"
- "regenerator-runtime": "^0.13.3"
Update 13/02
So I tried to type Promise.prototype on my site in edge and it does appear it is polyfilled:
So currently I'm investigating if some part of my chain (axios/vue axios) does not return a promise. Since it is working in chrome I'm suspecting that a part of the chain is not being polyfilled correctly?
This is my entire chain:
/* 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}`);
},
...
}