Javascript Phaser3 资产未在创建函数中加载答案

【问题标题】：Javascript Phaser3 Assets Not Loading In Create FunctionJavascript Phaser3 资产未在创建函数中加载
【发布时间】：2022-01-09 02:55:53
【问题描述】：

我正在尝试在 Phaser 的预加载功能之外将基本图像加载到我的 Phaser3 游戏中，但没有任何效果。

我试过了：

我的 utils.js 中的延迟加载功能：

dynImgLoader(textureKey,x,y,asset)
{
    let loader = new Phaser.Loader.LoaderPlugin(this.scene);
    loader.image(textureKey,asset);
    loader.once(Phaser.Loader.Events.COMPLETE, ()=>
    {
        console.log('sprite ready for usage');
    })
    loader.start();
}

调用时它仍然给我默认的移相器资产图像（未加载）

我尝试了 tutorial 在 index.js 中的 create 函数中告诉我的内容：

    this.load.image('arc_red', arc_red);
    this.load.onLoadComplete.add(this);
    this.load.start();

还是不行。

问题：

如何在不使用预加载功能的情况下为多人网络套接字游戏“动态”加载资源？为什么我做错了？

【问题讨论】：

标签： javascript node.js image canvas phaser-framework

【解决方案1】：

如果您在 create 函数中使用此代码（或其他非 preload 函数）它应该可以工作：。

this.load.image(key, url);   // add task
this.load.once('complete', callback, scope);  // add callback of 'complete' event
this.load.start();                     // start loading

我从this documentation 得到它，它可以在我的演示代码中使用。

这是一个工作的example on Phaser.io

【讨论】：

您好，感谢您的回复。我将this.load.image('arc_red', arc_red); this.load.once('complete', ()=>{console.log('image loaded!')}, this); this.load.start(); 放在我的创建函数中，当我稍后将精灵分配给该纹理键时，它似乎仍然没有加载。我可能做错了什么病态的错误。
当我使用我在回调中创建精灵的函数时，我的纹理变成了红色。但是我无法在任何地方访问精灵，因为它没有存储到我的状态对象中
@IAmNoob 您是从其他域加载图像吗？还是所有图片网址都是相对的？浏览器控制台有错误吗？
我正在使用 webpack 和 localhost 测试服务器。我的 assets 文件夹与 js 文件位于同一目录下，路径应该是正确的。 arc_red 变量是我从 './assets/arc_red.png' 导入的文件。它没有给我任何错误，并且当我使用存储导入文件的变量时，它会在回调中记录字符串。但是，当我将路径设置为字符串时，我收到错误XHRLoader.js?0bd9:57 GET http://localhost:8080/assets/arc_red.png 404 (Not Found)。
@IAmNoob 如果一切都在同一台服务器上，我的回答中关于 phaser.io 的示例应该可以工作。如您所知，webpack 的问题在于，根据配置，图像可以内联，在另一个输出文件夹中，或者...。您可以将图像的绝对路径放入加载脚本中，以查看如何在网络服务器上找到它。