如何從Require.js中導出全局變量？

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'); 
})); 

正如你所看到的，我試圖從內明確設置window.Foo暴露美孚全球空間都require調用，並通過結束片段的返回值從外部顯式設置它。但是沒有一個工作;如果我在加載構建文件後立即添加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()是異步，這意味着你傳遞作爲參數的函數的返回值是不通過require()本身返回。你的問題可能會以不同的方式來解決，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} 
});