javascript - 为相位器游戏添加 requirejs 后未调用 Typescript window.onload

标签 javascript requirejs typescript phaser-framework js-amd

我正在尝试使用 Phaser 和 TypeScript 制作游戏。我按照说明 here它最初有效。当我尝试使用 AMD 和 requirejs 模块化我的代码时出现了问题

index.html

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>Resonate</title>
    <link rel="stylesheet" href="app.css" type="text/css" />
    <script src="phaser.js"></script>
    <script src="http://requirejs.org/docs/release/2.1.20/minified/require.js" data-main="app"></script>
</head>
<body>
    <h1>RESONATE</h1>

    <div id="content"></div>
</body>
</html>

播放器.ts

export class Player {

    color: string;

    constructor() {
        this.color = "#0000ff";
    }
}

应用.ts

import player = require("Player");

class PhaserDemo {

    game: Phaser.Game;

    constructor() {
        this.game = new Phaser.Game(800, 600, Phaser.WEBGL, 'content', { preload: this.preload, create: this.create });
    }

    preload() {
        this.game.load.image('phaser_run', 'run.png');
    }

    create() {
        console.log("Before");
        var p = new player.Player();
        this.game.stage.backgroundColor = p.color;
    }
}

window.onload = () => {
    console.log("ONLOAD");
    var game = new PhaserDemo();
};

现在当我加载它时 window.onload 永远不会被调用,我尝试了以下 window.onload not calling function 对于 Javascript 解决方案,但我无法在 typescript 中使用它。

如果您想查看,这里还有生成的 Javascript https://gist.github.com/koreus7/06bee4a30d22bdc76d62

最佳答案

for the Javascript solution but I can't get it to work in typescript.

基本上,如果窗口已经加载,附加到 window.onload 将不会调用附加函数。

检查 document.readyState === "complete"。或者使用类似 jquery ready 的东西:https://api.jquery.com/ready/

关于javascript - 为相位器游戏添加 requirejs 后未调用 Typescript window.onload,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31908069/

相关文章:

javascript - ng-container Angular 9 Flex 布局无法读取未定义 fxFlex 问题的属性 'setProperty'

javascript - Ionic2、Angular、使用 API 调用进行表单验证

javascript - 如何保证两个setInterval()不会互相影响?

javascript - 使用 react 导航限制返回

javascript - 遍历 react 元素中的未定义/空对象

javascript - 如何使这个发布/订阅代码更具可读性?

closures - AMD Optimizer (r.js) 不产生任何输出

javascript - Angular - 当 observable 完成时,做一些事情

javascript - 密码对比

javascript - 尝试实例化模型时对象不是函数错误