为什么在 Phaser 中无法加载图像?

问题描述

我正在关注此tutorial 我按照说明做了一切,但我的图片没有加载,我得到了这个:

enter image description here

我的代码

main.js:

/** @type{import{"../libs/phaser"}} */


var config = {
    type: Phaser.AUTO,width: 800,height: 600,scene: {
        preload: preload,create: create,update: update
    }
};

function preload ()
{
    this.load.image('sky','assets/sky.png');
    this.load.image('ground','assets/platform.png');
    this.load.image('star','assets/star.png');
    this.load.image('bomb','assets/bomb.png');
    this.load.spritesheet('dude','assets/dude.png',{ frameWidth: 32,frameHeight: 48 }
    );
}

function create ()
{
    this.add.image(400,300,'sky'); 
    this.add.image(400,'star');
}

function update ()
{
}

var game = new Phaser.Game(config);
game.state.add('GameState',GameState);
game.state.start('GameState')

index.html:

<!DOCTYPE html>
<html lang="en">
<head>
    <Meta charset="UTF-8">
    <Meta http-equiv="X-UA-Compatible" content="IE=edge">
    <Meta name="viewport" content="width=device-width,initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script src="./libs/phaser.js"></script>
    <script src="main.js"></script>
</body>
</html>

我的项目结构:

enter image description here

我尝试过的:

  1. 在 chrome/edge/firefox 上运行
  2. 将 .png 移到文件夹外

我想这不是代码的问题,所以我不知道它在哪里以及如何解决它。 这是我的错误

enter image description here

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)