为相位器游戏添加 requirejs 后未调用 Typescript window.onload
Typescript window.onload not being called after adding requirejs for phaser game
我正在尝试使用 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>
Player.ts
export class Player {
color: string;
constructor() {
this.color = "#0000ff";
}
}
app.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 从未被调用,我尝试了以下
对于 Javascript 解决方案,但我无法在打字稿中使用它。
这里还有生成的Javascript如果你想看看https://gist.github.com/koreus7/06bee4a30d22bdc76d62
for the Javascript solution but I can't get it to work in typescript.
基本上如果 window 已经加载附加到 window.onload
将不会调用附加函数。
检查 document.readyState === "complete"
。或者使用类似 jquery ready 的东西:https://api.jquery.com/ready/
我相信这是由 require.js 加载器引起的,我没有明确知道它有点类似于 jspm system.js ,所以我们不需要确保 window 已加载,因为加载程序已经确保了这一点。
我刚刚删除了 window.onload,它运行良好:)
我正在尝试使用 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>
Player.ts
export class Player {
color: string;
constructor() {
this.color = "#0000ff";
}
}
app.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 从未被调用,我尝试了以下
这里还有生成的Javascript如果你想看看https://gist.github.com/koreus7/06bee4a30d22bdc76d62
for the Javascript solution but I can't get it to work in typescript.
基本上如果 window 已经加载附加到 window.onload
将不会调用附加函数。
检查 document.readyState === "complete"
。或者使用类似 jquery ready 的东西:https://api.jquery.com/ready/
我相信这是由 require.js 加载器引起的,我没有明确知道它有点类似于 jspm system.js ,所以我们不需要确保 window 已加载,因为加载程序已经确保了这一点。
我刚刚删除了 window.onload,它运行良好:)