模块化 js 模式中的 Webfont 加载器答案

【问题标题】：Webfont Loader in modular js pattern模块化 js 模式中的 Webfont 加载器
【发布时间】：2016-05-27 20:16:49
【问题描述】：

webfont 加载器文档提供了这个示例脚本：

WebFontConfig = {
  typekit: { id: 'xxxxxx' }
};

(function(d) {
  var wf = d.createElement('script'), s = d.scripts[0];
  wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.16/webfont.js';
  s.parentNode.insertBefore(wf, s);
})(document);

如果我将它直接放在我页面的<head> 的脚本标记中，它就可以正常工作。如果我将它包装在一个函数中并尝试导出它，我会在控制台中收到此错误：

未捕获的 ReferenceError：未定义 WebFontConfig

这是我尝试包装它的方式：

function initialiseWebFontLoader() {
    WebFontConfig = {
        google: {
            families: ['Open Sans', 'Lora']
        },
        timeout: 1500
    };

    (function(d) {
        const wf = d.createElement('script'), s = d.scripts[0];
        wf.src = 'https://ajax.googleapis.com/ajax/libs/webfont/1.6.16/webfont.js';
        s.parentNode.insertBefore(wf, s);
    })(document);
}

module.exports = {
    initialiseWebFontLoader: initialiseWebFontLoader
};

我在这里做错了什么吗？

【问题讨论】：

标签： javascript webfont-loader

【解决方案1】：

哦，我需要将WebFontConfig 附加到窗口对象。

window.WebFontConfig.

【讨论】：