javascript - 使用 RequireJS 加载 PreloadJS

标签 javascript requirejs preloadjs

我刚开始使用 RequireJS 加载模块,特别是加载像 CreateJS 这样的库。我想将 PreloadJS 与 SoundJS 一起使用。我已经通过 RequireJS 正确加载了 SoundJS,到目前为止我没有遇到问题。我遇到的问题是 PreloadJS。我使用这种方式加载它:

require.config(
  {
    paths :
    {
        soundjs   : 'core/soundjs-0.6.1.min'
      , preloadjs : 'core/preloadjs-0.6.1.min'
    }

    ,shim :
    {
        'preloadjs' : { exports : "createjs" }
      , 'soundjs'   : { exports : "createjs.Sound" }
    }
  });

require(['src/MainGameScene' , 'src/Runner' , 'core/pixi.js' , 'core/tween.min' , 'preloadjs' , 'soundjs' ]
, function(MainGameScene , Runner , PIXI, TWEEN , PreloadJS , SoundJS)
{
  console.log("Endless Runner modules loaded.");

  var screenSize = { width : 960 , height : 500};
  var renderer = PIXI.autoDetectRenderer(screenSize.width , screenSize.height);

  new PIXI.loaders.Loader()
    .add("_assets/textures/p1_walk/Von.json")
    .add("_assets/textures/p2_walk/Don.json")
    .add("_assets/textures/p3_walk/Bon.json")
    .add("_assets/textures/tiles.json")
    .add("_assets/textures/textures.json")
    .once("complete" ,
      function()
      {
        var queue = new PreloadJS();
        SoundJS.alternateExtensions = ["mp3" , "ogg" , "wav" ];
        queue.installPlugin(SoundJS);
        queue.addEventListener("complete" , onFinishedLoading);
        queue.loadManifest(
          [
            {id : "bgm1"  , src : "_assets/bgm/bgm.mp3"}
           ,{id : "jump" , src : "_assets/sfx/jump.wav" }
           ,{id : "pickupcoin" , src : "_assets/sfx/pickupcoin.wav" }
          ]);
      })
    .load();

  function onFinishedLoading()
  {
    new MainGameScene(renderer , screenSize);
  }

  document.body.appendChild(renderer.view);
});

当我运行调试器时,它显示 PreloadJS 对象具有此属性,我认为该属性不是 PreloadJS 的一部分。我还检查了原型(prototype)是否正确,但我将 Object 作为其原型(prototype):

noConflict: function()
parse : function parse()
runInContext : function a(b, d)
stringify : function stringify()
__proto__ : Object

我还错过了什么?我还尝试像这样填充 PreloadJS:

    'preloadjs' : { exports : "createjs.LoadQueue" }
  , 'soundjs'   : { exports : "createjs.Sound" }

但我仍然得到一个具有这些属性的对象。我需要 RequireJS,这样我就可以让我的 SoundJS 具有可靠的预加载器。我找不到任何关于将 PreloadJS 与 RequireJS 一起使用的文章,所以我确信我做错了、非常规且未记录的事情,所以我将不胜感激任何帮助。

最佳答案

好的,已经解决了。虽然不太理想,但 preloadjs 并不是针对 AMD 编写的。 如果您的项目绝对要求您通过 Bower 或其他方式包含依赖项,那么这可能不是最佳选择,但面对绝对没有其他修复,我对此非常满意。

基本上,采用您的 preloadjs 版本,并将整个文件包装在 Define() 调用中:

define(function(){
    //Paste the contents of preloadjs here
    //After all the preloadjs code you need to return the reference to createjs:
    return this.createjs
});

将此版本添加到您的依赖项列表中,一切都应该正常工作。

关于javascript - 使用 RequireJS 加载 PreloadJS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33590054/

相关文章:

javascript - 如何使用 underscore.js 将同一对象克隆为三个对象

javascript - 计算嵌套的 ng-repeats 总数并更新 angularjs 中的多个 Controller /模型

javascript - 如何防止 dynamicMapLayer 在每次缩放或平移 map 时刷新?

asp.net-mvc - 如何在Require.js中引用捆绑的js文件(asp.net mvc4)?

javascript - PreloadJS 对于稍后附加的元素无法正常工作(在 Firefox 中)

javascript - 在 Internet Explorer createjs-preloadjs 中预加载声音不起作用

javascript - 函数完成 10 秒后重复运行函数 (JavaScript)

backbone.js - 如何使用 RequireJS 加载 Backbone 深度模型?

javascript - 阻止优化文本!和 json! requirejs 优化工具上的插件

electron - 如何使用preload.js将ipcRenderer.invoke处理程序答案传递给 Electron 渲染器进程