webpack - 使用 Promise.all() 从 Axios 转换为 Fetch

Question

我正在使用 Promise.all() 进行一系列 axios.get() 调用，并确保它们在继续之前全部返回，如下所示:

Promise.all([getJSON1(), getJSON2()])
    .then((arr) => {
        var data = {
            json1: arr[0],
            json2: arr[1]
        };

        return data;
    });

函数 getJSON1() 和 getJSON2() 如下所示:

function getJSON1() {
    return axios.get('json1-url.json');
}

这一切都工作正常，但是我想知道当 webpack 完成它的工作时，用 fetch 替换 axios 是否会减少我的最终bundle.js的大小。

我正在尝试 fetch polyfill并按照this blog将其与webpack集成，但是我只是不确定如何调整 getJSON1() 以使用 fetch。我尝试了以下方法:

function getJSON1() {
    return fetch('json1-url.json');
}

这会导致类型错误:对象不是构造函数(评估“新 Promise”)

Answer 1

We can call the fetch method like this , hope it may help you:-

function getJSON1() {
    return fetch('json1-url.json')
      .then((response) => response.json())
      .then((responseJson) => {
        return responseJson;

      })
      .catch((error) => {
        console.error(error);
      });
}