Question

我正在尝试使用Require.js创建一个外部库。感谢Require.js not compiling single js file correctly和Require.js (almond.js) Timing Off我已经想出如何将所有内容“编译”到一个优化/构建的文件中，并且该单个文件可以正常工作。只有一个问题：我无法弄清楚如何为我的库设置变量。

假设我希望我的库创建window.Foo。我尝试使用main.js文件：

window.Foo = require([], function() {
    window.Foo = {someValue: 1};
    return {someValue: 2};
});

和包装结束片段：

    return require('main');
}));

正如您所看到的，我尝试通过在require调用中显式设置window.Foo并通过结束片段的返回值从外部显式设置Foo来将Foo暴露给全局空间。但是没有人工作;如果我在加载构建文件后立即添加console.log(window.foo)，它会告诉我window.Foo未定义。

如果我执行window.setTimeout window.Foo最终会设置（{someValue: 1}），但我不能指望我的用户必须在超时时包装所有代码。任何人都可以解释一下我的优化/构建文件加载后如何定义window.Foo？

Answer 1

如果您按照James的说明here，您可以轻松地创建一个库，该库被设计为一组可以同步加载的RequireJS模块。

我有一个github repository说明了整件事。重点：

main模块将Foo导出到全局空间：
```
define('main', ["./modC"], function () {

console.log("inside");
window.Foo = {someValue: 1};

return {someValue: 2};

});
```
它还返回一个由起始片段导出为Bar的值（即root.Bar = factory();所示的行）。因此，它说明了两种导出到全球空间的方法。
r.js使用的包装器代码以同步形式require开始为主：
```
require(`main`);
```

如果你加载它，你会看到以下输出：

outside
loaded modC
inside
out in the HTML!
value of window.Foo: Object {someValue: 1}
value of window.Bar: Object {someValue: 2}

Answer 2

对require()的调用是 async ，这意味着您作为参数传递的函数的返回值是require()本身返回的 not 。您的问题可以通过不同的方式解决， RequireJS方式是在模块中定义代码并将其作为依赖项：

// mymodule.js
define([], function() {
    window.Foo = {someValue: 1};
    return {someValue: 2};
});

// main.js
require(['mymodule'], function (mymodule) {
    console.log(window.Foo); // {someValue: 1}
    console.log(mymodule); // {someValue: 2}
});

如何从Require.js导出全局变量？

2 个答案: