gpt4 book ai didi

typescript - 如何使用 SystemJS 模块启动 Typescript 应用程序?

转载 作者:搜寻专家 更新时间:2023-10-30 21:23:42 25 4
gpt4 key购买 nike

我正在使用 typescript 编译器将我的模块捆绑到一个 main.js 文件中,使用 tsconfig.json 中的这些设置:

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

这有效,所以根据 SystemJS documentation ,我只需要包含 SystemJS 生产文件并在我的 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);
}
}

这会在 main.js 中产生这段 javascript 代码:

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

我遗漏的部分(Microsoft's always-lacking-Typescript-documentation 中也没有解释)是如何实际启动应用程序……SystemJS 如何知道哪个类是起点?即使我只是将 console.log 放入我的应用程序中,它也不会执行....

编辑

我发现使用 system.js 而不是 system-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>

最佳答案

经过一番摸索之后,我发现答案比预期的要简单:只需先将 bundle 作为常规 .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>

关于typescript - 如何使用 SystemJS 模块启动 Typescript 应用程序?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44328643/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com