Estoy empezando a usar phaser para crear juegos y me encontré con un problema que no consigo encontrar por mas pruebas que hice. No consigo que se muestran las imágenes que voy cargando. Solo se ve un pequeño cuadrado en el centro, ( lo muestro en esta captura: cuando se debería de ver todo el fondo del canvas en verde, que es la imagen que primero cargo. En el ejemplo solo cargo una, para que más si no funciona. No veo cual es error que estoy cometiendo, pues el inspector del navegador, no muestra errores. El servidor está creado con Node.js.
const http = require('http')
const fs = require('fs')
const server = http.createServer((req, res) => {
fs.readFile("./part1.html", (err, data) => {
if(err){console.error(err); return;}
res.end(data)
})
})
console.log('escuchando en el puerto 3000')
server.listen(3000)
Muestro el código para si alguien puede ver el error que estoy cometiendo. Gracias.
var config = {
type: Phaser.AUTO,
width: 800,
height: 600,
scene: {
preload: preload,
create: create,
update: update
}
};
var game = new Phaser.Game(config);
function preload() {
this.load.image('sky', 'sky.png')
this.load.image('ground', 'platform.png')
this.load.image('star', 'star.png')
this.load.image('bomb', 'bomb.png')
this.load.spritesheet('dude', 'dude.png',{
frameWidth: 32, frameHeight: 48
});
}
function create() {
this.add.image(400, 300, 'sky')
}
function update() {
}
body {
margin: 0;
}
<!doctype html>
<html lang="es">
<head>
<meta charset="UTF-8" />
<title>Making your first Phaser 3 Game - Part 1</title>
<script src="//cdn.jsdelivr.net/npm/phaser@3.15.1/dist/phaser.js"></script>
</head>
<body>
</body>
</html>