[英]Typescript, no 'window' events when adding an import statement
So I'm pretty new to typescript, javascript and web-shizzles (I normally build native apps). 因此,我对打字稿,JavaScript和Web-shizzles非常陌生(我通常会构建本机应用程序)。 But I'm experimenting with Phaser3 and use VSCode with typescript to transpile the javascript files.
但是我正在使用Phaser3进行实验,并使用带有Typescript的VSCode来转换javascript文件。 First I used namespaces (C# background), but apparently that's not the way to go in typescript, so I removed the namespaces and used export with corresponding import statements.
首先,我使用了命名空间(C#背景),但显然这不是输入打字稿的方法,因此我删除了命名空间,并使用了带有相应导入语句的导出。
The problem: It took me a while to figure out that my window event (window.onload) doesn't fire because of importing a required type. 问题:我花了一段时间才弄清楚我的窗口事件(window.onload)由于导入了必需的类型而没有触发。 This event is kind of the entry point to the app.
该事件是应用程序的入口点。 Suggestions for other ways to kick start the project are always welcome.
始终欢迎提出其他启动项目的建议。 Here is the code:
这是代码:
window.onload DOES NOT FIRE: window.onload不会触发:
import { Boot } from "./Boot";
window.onload = () => {
console.log("Test");
Boot.runApp();
}
After removing the 'import', window.onload FIRES! 删除“导入”后,window.onload火灾!
//import { Boot } from "./Boot";
window.onload = () => {
console.log("Test");
//Boot.runApp();
}
Boot.ts Boot.ts
imports...
export class Boot {
static runApp() {
console.log("RUN APP!!");
//Start the game... (code removed)
}
}
This is my tsconfig: 这是我的tsconfig:
{
"compileOnSave": true,
"compilerOptions": {
"target": "ES5",
"module": "system",
"sourceMap": false,
"outDir": "bin/js/",
"outFile": "bin/js/game.js"
},
"include": [
"./src/**/*"
],
"files":[
"./tsDefinitions/nineslice.d.ts",
"./tsDefinitions/phaser.d.ts"
]
}
Any ideas why it behaves like this? 任何想法为什么它会这样? It's a bit annoying because that spot launches my game code.
有点烦人,因为那个地方启动了我的游戏代码。 Is it possible to start my 'Boot.runApp()' function from a tag in my index.html?
是否可以从index.html中的标签启动我的'Boot.runApp()'函数?
When you import
/ export
you create a module. import
/ export
将创建一个模块。 You are using SystemJS ( module: system
in your tsconfig). 您正在使用SystemJS(
module: system
tsconfig中的system)。 Modules are wrapped in system register blocks: 模块包装在系统寄存器块中:
System.register("index", [], function (exports_2, context_2) {
"use strict";
var __moduleName = context_2 && context_2.id;
return {
setters: [],
execute: function () {
window.onload = function () {
console.log("Test");
};
}
};
});
You need to run something like System.import('index.js');
您需要运行类似
System.import('index.js');
to run that code. 运行该代码。 When your typescript file is not a module, the
window.onload
is put directly into the compiled output, not wrapped in a System.register
, which means it will be immediatly executed when you load the file. 如果您的打字稿文件不是模块,则将
window.onload
直接放入已编译的输出中,而不包装在System.register
,这意味着在加载文件时将立即执行该文件。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.