如何飲用打字稿模塊：在瀏覽器systemjs

Question

我試圖使用systemjs系統導出，我已經遠銷這個代碼與TSC： https://github.com/quantumjs/solar-popup/blob/master/package.json#L10

{ 
    "compilerOptions": { 
    "module": "system", 
    "target": "es5", 
    "sourceMap": true, 
    "outFile":"./build/solar-popup.js", 
    "sourceRoot": "./src/SolarPopup.ts", 
    "rootDir": "./src/" 

    }, 
    "exclude": [ 
    "node_modules" 
    ] 
} 

但是隨後試圖使用它在瀏覽器導入的對象不包含任何導出。我認爲，這是由於不包含任何出口太陽能popup.js，只是System.register調用

出口是這樣的：

System.register("SolarPopup", ["ModalBackground", "constants"], function (exports_4, context_4) { 
    "use strict"; 
    var __moduleName = context_4 && context_4.id; 
    var ModalBackground_1, constants_2, SolarPopup; 
    return { 
     setters: [ 
      function (ModalBackground_1_1) { 
       ModalBackground_1 = ModalBackground_1_1; 
      }, 
      function (constants_2_1) { 
       constants_2 = constants_2_1; 

等

Answer 1

當你有這兩個選項tsconfig.json

"module": "system", 
"outFile":"./build/solar-popup.js", 

打字稿生成一個包含若干System.register調用單個輸出文件，每個註冊模塊有自己的名稱：

System.register("SolarPopup", ["ModalBackground", "constants"], function ... 

「SolarPopup」是一個模塊名稱這裏。 SystemJS將此文件解釋爲bundle, not a module。

導入捆綁包的結果是一個空對象，副作用是所有內部模塊都已註冊，並且立即可用於導入而無需獲取它們。

所以你需要一個額外的導入從包中獲取一個模塊。試試這個：

System.import('../build/solar-popup.js').then(function() { 
    System.import('SolarPopup').then(function(SolarPopup) { 
     console.dir(SolarPopup); 
    }); 
});