javascript - 为什么图像没有在 Phaser 中加载？

问题描述

我正在关注本教程，我按照说明做了所有事情，但是我的图像没有加载，我得到了这个：

我的代码：

主.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, 300, 'star');
}

function update ()
{
}

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

索引.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>

我的项目结构：

我试过的东西：

在 chrome/edge/firefox 上运行
将 .png 移出文件夹

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

标签： javascriptphaser-framework

javascript - 为什么图像没有在 Phaser 中加载？

问题描述

解决方案

推荐阅读