Phaser，图片替换为绿色方块，无错误，JS答案

【问题标题】：Phaser, Image Replaced By Green Square, No Errors, JSPhaser，图片替换为绿色方块，无错误，JS
【发布时间】：2022-01-27 22:48:41
【问题描述】：

我在网上精确地遵循了许多 Phaser 教程，并确保图像的路径足够，但我发现自己被一个绿色方块卡住了，上面有一个破折号来放置我的图像 green square.

我怀疑这可能是我设置测试服务器的方式，我为此使用包裹。我已经尝试了许多使用 Phaser 的 preLoad() 函数加载图像的实现，但即使是最简单的 this.load.image('testing','../../assets/user/body/moveRightAtlas.png');（在 preLoad 中）和 var testing=this.add.sprite(400,400,'testing');（在 create 中）仍然会打印正方形。对于路径，我尝试了绝对路径，但仍然无法正常工作。这是我的目录的设置方式。 directories 。我的问题是，我做错了什么？我是 Phaser 的绝对菜鸟，因此非常感谢任何帮助，谢谢。

（编辑：对于我不小心说moveRight0的目录截图，我的意思是moveRightAtlas.png）

阅读更多内容后，该图像似乎存在，但我用来测试游戏的网络服务器似乎无法加载它。所以问题很可能出在网络服务器上。我正在使用包裹。

【问题讨论】：

你能再分享一些代码吗？这样会更容易找到问题
谢谢你的时间，我所拥有的只是一个空场景，上面有我提到的代码。然后它在主文件中启动。我可以向您保证，主要和场景中的所有内容都正确编写。我编辑了上面的问题，提到这可能是我设置的网络服务器无法加载资源的问题，在这之后我一无所知。

标签： javascript image game-development phaser-framework parcel

【解决方案1】：

路径应该是相对于 HTML 文件的，所以在你的情况下：

this.load.image('testing','assets/user/body/moveRightAtlas.png');

【讨论】：

谢谢，但我已经试过了。
@IAmNoob 如果您在preload 中加载图像并在create 中添加图像，它应该可以工作。图片有效吗？
确实有效

【解决方案2】：

您可能应该将资产目录移动到您的src 中，然后从那里开始。

Here's how 这个 samme 的 a working parcel setup 存储库正在进行导入：

[...]
    import images from './assets/*.png';
[...]
    this.load.image('space', images.space);
[...]

在你的情况下，它可能是这样的：

[...]
     import moveRightAtlas from './assets/user/body/moveRightAtlas.png'; 
[...]
     this.load.image('testing', moveRightAtlas);
[...]

还要检查其 README 以获取用于复制资产的插件。

【讨论】：