加載捆綁AMD模塊，SystemJS

我有一對夫婦的AMD模塊使用打字稿的--outFile選擇到一個單一的文件編譯：加載捆綁AMD模塊，SystemJS

define("partA", ["require", "exports"], function (require, exports) { 
    "use strict"; 
    function partAFunc() { 
     console.log('partAFunc'); 
     return 'partAFunc'; 
    } 
    exports.partAFunc = partAFunc; 
}); 
define("partB", ["require", "exports"], function (require, exports) { 
    "use strict"; 
    exports.partB = 42; 
}); 
define("partC", ["require", "exports"], function (require, exports) { 
    ... 
});

現在我想只載入partA模塊，並調用其partAfunc()所以我可以做在Node.js的以下內容：

SystemJS.config({ 
    map: { 
    'main': 'my-bundle.js', 
    }, 
}); 

SystemJS.import('main').then((m) => { 
    SystemJS.import('partA').then((m) => { 
    m.partAFunc(); 
    }); 
});

首次進口SystemJS.import('main')剛剛註冊的所有模塊，然後SystemJS.import('partA')作品，因爲模塊partA已經註冊（或至少我客串這就是它的作用）。

可是，爲什麼我不能只用SystemJS.import('partA')和配置捆綁作爲一個依賴：

SystemJS.config({ 
    meta: { 
    'partA': { 
     deps: [ 'my-bundle.js' ], 
    } 
    } 
}); 

SystemJS.import('partA').then((m) => { 
    m.partAFunc(); 
});

的meta完全被忽略。 https://github.com/systemjs/systemjs/blob/master/docs/config-api.md#meta的文檔說：

在此模塊之前加載的相關性。通過常規路徑並映射規範化。僅支持cjs，amd和全局格式。

它看起來像SystemJS首先檢查文件partA是否存在（這顯然並非如此），並拋出一個錯誤（我與現有的文件進行了測試和meta配置工作）：

(node:60981) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: ENOENT: no such file or directory, open '/Users/.../partA' 
    Instantiating /Users/.../partA 
    Loading partA

我期望當第一個變體與兩個嵌套的SystemJS.import調用一起工作時，以下應該也能工作。

SystemJS.config({ 
    map: { 
    'partA': 'my-bundle.js', 
    }, 
}); 

SystemJS.import('partA').then((m) => { 
    // m.partAFunc(); 
    console.log(m) 
});

這會打印一個空的對象。它看起來像是當一個文件中有多個模塊時，它只註冊它們並且不加載它們中的任何一個？

我看過https://github.com/systemjs/systemjs/tree/master/docs的所有文件，但我想我還是輸了。

來源

2017-02-28 martin

你需要做的就是使用bundles設置和設置您的捆綁像這樣的內容：

bundles: { 
     'my-bundle.js': ['partA', 'partB', 'partC'], 
    },

粗略地說，這告訴SystemJS「當你尋找模塊partA，讀取和執行模塊命名my-bundle.js和你那裏會找到partA。「

使用meta無法工作，你的做法。您meta設置不會說「不嘗試獲取名爲A部分一個模塊，而是取my-bundle.js」它說：「當你處理partA，除了已經擁有的依賴，增加對my-bundle.js依賴性列表「。 SystemJS仍將獲取partA。在它試圖獲取它之前沒有理由等到它執行my-bundle.js，因此它立即啓動提取並失敗。

來源

2017-03-15 14:16:52 Louis

我以爲'bundles'選項只適用於使用SystemJS Builder創建的bundle，這意味着我需要使用System模塊格式。我正在使用AMD格式。我想我現在明白'deps'的作用了。它按順序加載模塊，所以兩者都需要存在，但是它們首先用'deps'執行。 – martin

你可以在AMD模塊中使用'bundle'。我已經完成了。沒有涉及SystemJS構建器。該文檔具有誤導性。關於構建器和使用'System.register'的說法僅用於說明目的（這是*一種*做法）。它不是*規定性*。 – Louis

這很有趣，我只是測試過它，它也適用於AMD模塊。 – martin

加載捆綁AMD模塊，SystemJS

回答

相關問題