As someone who primarily works on native apps, diving into the world of TypeScript, JavaScript, and web development with Phaser3 has been quite the learning experience for me. I've transitioned from using namespaces to exports and imports in my TypeScript files, but encountered an issue where my window event (window.onload) wasn't firing due to a required type being imported.
This window event serves as the entry point to my app, so not having it fire was a major roadblock. I'm open to suggestions on alternative approaches to getting my project started successfully. Here's the segment of code causing the problem:
window.onload DOES NOT FIRE:
import { Boot } from "./Boot";
window.onload = () => {
console.log("Test");
Boot.runApp();
}
Upon removing the 'import' statement, window.onload FIRES!
//import { Boot } from "./Boot";
window.onload = () => {
console.log("Test");
//Boot.runApp();
}
Boot.ts
imports...
export class Boot {
static runApp() {
console.log("RUN APP!!);
//Code to start the game... (excerpt of code)
}
}
This is how my tsconfig looks like:
{
"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 insights into why this behavior occurs? It's frustrating as that part launches my game logic. Would it be feasible to trigger my 'Boot.runApp()' function from a script tag in my index.html instead?