如何用SystemJS模块启动一个Typescript应用程序？

我现在用的打字稿编译器捆绑我的模块集成到一个main.js文件，使用tsconfig.json这些设置：如何用SystemJS模块启动一个Typescript应用程序？

"module": "system", 
"out": "docs/js/main.js"

这工作，所以要根据SystemJS documentation，我只需要包括SystemJS生产文件和kickstart的，在我的HTML这些标签的应用：

<script src="js/system.js"></script> 
<script> 
    SystemJS.import('js/main.js'); 
</script>

我的应用程序：

import { Message } from "./message"; 

export class App { 
    constructor() { 
     let demomessage = new Message("hello"); 
    } 
} 

export class Message {  
    constructor(str:string) { 
     console.log(str); 
    } 
}

这RESU

System.register("message", ...) { 
    // message code here 
}); 
System.register("app", ...) { 
    // app code here 
});

我失踪（而这还没有Microsoft's always-lacking-Typescript-documentation解释）是如何真正启动应用程序的一部分...如何SystemJS知道哪个类是：在main.js这段JavaScript代码LTS起点？即使我只是把在执行console.log我的应用程序不执行....

编辑

我发现，使用system.js代替系统production.js至少启动过程。经过大量的摆弄之后，我的应用程序开始使用下面的代码，但它看起来很奇怪和丑陋。这是它应该如何工作？

<script src="js/system.js"></script> 
<script> 
    // get the anonymous scope 
    System.import('js/main.js') 
    .then(function() { 
     // now we can get to the app and make a new instance 
     System.import('app').then(function(m){ 
     let app = new m.App(); 
     }) 
    }); 
</script>

来源

2017-06-02 Kokodoko

是的，这就是它应该如何工作。第一次导入只是为了预先填充模块注册表而加载bundle，bundle中没有内容会告诉哪个模块应该执行，这就是第二次导入的目的。 – artem

谢谢，但有什么方法可以在应用程序加载后自行启动？大多数的systemjs教程只提到import（js/main.js），这似乎足够了......？ – Kokodoko

如果'js/main.js'是一个包含多个模块的包，换句话说，它有几个'System.register（）'调用是没有办法的。我想所有的教程都假设它是一个单独的模块，也许是通过汇总构建的，或者是将它们分开并分别加载所有其他模块。 – artem

多头部划伤后，我找到了答案更简单比预期：只要先加载包作为常规的.js文件，然后就可以直接导入应用程序：

<script src="js/system.js"></script> 
<script src="js/main.js"></script> 
<script> 
    System.import('app').then(function(module) { 
    let a = new module.App(); 
    }); 
</script>

来源

2017-06-11 16:12:34 Kokodoko

如何用SystemJS模块启动一个Typescript应用程序？

回答

相关问题