使用requirejs结构时，不显示画布中的画布

Question

我有一个让我发疯的问题。

我有一个在一个JavaScript文件中可以正常工作的东西，但是与requirejs一起使用时完全失败。

(function(){
define([], function (){
    var Sprite = function(){
        return {
            spritesheet:    null,
            canvas:         null,
            context:        null,

            init: function(src, ctx){
                this.canvas = document.createElement('canvas');
                this.context = this.canvas.getContext('2d');
                this.context.drawImage(src, 0, 0, 10, 20, 0, 0, 10, 20);
                ctx.drawImage(this.canvas, 100, 100);
            }
        };
};

return Sprite;
});
}
)();

在其他文件中，我有：

(function(){
define(["r", "sprite", "player"], function (Ra, Sprite, Player){
    var Game = function()
    {
        return {
            ...SOME STUFF HERE...
            canvas: null,
            context: null,

            something: function() {
                this.canvas = document.getElementById("game");
                this.canvas.width = 500;
                this.canvas.height = 500;
                this.context = this.canvas.getContext("2d");

                var sprite = new Sprite();
                sprite.init("image.gif", this.context);
         };
     };

     return Game;
});
}
)();

我试图尽可能地压缩代码，希望我没有删节任何重要的内容，但这基本上是不起作用的部分。 我也是requirejs的新手，所以如果我做错了什么，请告诉我。

无论我做什么，似乎一切都很好，两个画布都创建了，都具有正确的属性，但是我放置在第一个画布上的第二个画布没有显示。 如果我将普通图像替换为画布，则效果很好，但画布上的画布却不能。

这让我发疯了，我尝试了很多可能性，没有所有requirejs的东西，代码也可以正常工作，但是当我以这种方式构造它时，它就会失败。 它与全局范围有关吗？ 如何使这项工作？ 我需要帆布里面的帆布。

感谢您的时间！

编辑：

我在HTML文件中仅加载了<script data-main="main" src="libs/require/require.js"></script> ，在正文中仅包含了<canvas id="game"></canvas> 。

然后在main.js中，我有：

require.config({ 
baseUrl: "./modules",
waitSeconds: 10,
packages: [
    {
        name: "something not used yet",
        location: "something not used yet",
        main: "something not used yet"
    }
]
});

require(['game'], function (Game)
{
    var game = new Game();
    game.begin();
});

我已经在一开始就显示了休息。

我在build文件夹中有main.html和main.js，在build / modules文件夹中有其他所有文件。

Answer 1

问题是有史以来最荒谬的事情，我浪费了很多时间去弄清楚这种明显的事情……

出于某种原因，我完全忘记等待图像加载，甚至在图像加载之前就一直使用它，而使用requirejs时复杂的（至少对我来说）结构很难确定该错误。

同样，在没有requirejs的情况下，代码也能正常工作，因为图像加载速度如此之快，即使没有onload也可以在下一个函数启动之前就准备好了，但是当我切换到requirejs时，我猜它要么变慢了，要么是它的异步特性造成了问题。

无论如何，可以通过简单的onload处理程序解决。