正在寻找 fetch js/css 解决方案

Question

我正在寻找类似 fetch-inject or How do I include a JavaScript file in another JavaScript file? 的解决方案。我非常喜欢fetch-injec，因为我可以注入多个文件，甚至css。唯一的问题是它不支持 IE10，不幸的是，这对我来说至关重要。任何想法，建议的解决方案？哦，也没有 jquery。

在 fetch-inject 中是这样工作的：

fetchInject([
    'assets/vendor/foo.js',
    'assets/vendor/bar.js',
    'assets/vendor/foo.css'
]).then(() => {
    // after load, do something        
});

fetch-inject主要代码：

const fetchInject = function (inputs, promise) {
if (!arguments.length) return Promise.reject(new ReferenceError("Failed to execute 'fetchInject': 1 argument required but only 0 present."))
if (arguments[0] && arguments[0].constructor !== Array) return Promise.reject(new TypeError("Failed to execute 'fetchInject': argument 1 must be of type 'Array'."))
if (arguments[1] && arguments[1].constructor !== Promise) return Promise.reject(new TypeError("Failed to execute 'fetchInject': argument 2 must be of type 'Promise'."))

const resources = [];
const deferreds = promise ? [].concat(promise) : [];
const thenables = [];

inputs.forEach(input => deferreds.push(
  window.fetch(input).then(res => {
    return [res.clone().text(), res.blob()]
  }).then(promises => {
    return Promise.all(promises).then(resolved => {
      resources.push({ text: resolved[0], blob: resolved[1] });
    })
  })
));

return Promise.all(deferreds).then(() => {
  resources.forEach(resource => {
    thenables.push({ then: resolve => {
      resource.blob.type.includes('text/css')
        ? head(window, document, 'style', resource, resolve)
        : head(window, document, 'script', resource, resolve);
    } });
  });
  return Promise.all(thenables)
})

};

Answer 1

这是一种方法。缺点是你不知道文件什么时候被加载，好的部分是它无处不在并且不干扰其他代码：

function addScript(script) {
    var jsElement = document.createElement("script");
    jsElement.type = "application/javascript";
    jsElement.src = script;
    document.body.appendChild(jsElement);
}

function addScript("YOUR-SCRIPT-URL.js");

Answer 2

看来我需要添加一个不同的 polyfill，它叫做 whatwg-fetch。它包含导致 IE 出现问题的 Response.clone()。如果有人想在 IE10+ 中使用 fetch-inject，也可以使用它和 string-includes-polyfill。这些将涵盖所有情况。

正在寻找 fetch js/css 解决方案

Looking for a fetch js/css solution

javascript

internet-explorer

fetch

promise