需要.js错误：模块加载超时：backbone，jquerymobile。

Question

需要.js错误：模块加载超时：backbone，jquerymobile。

65

我正在尝试使用r.js来优化我的代码，但是我一直遇到这个错误：

正在追踪init的依赖项

Error: Load timeout for modules: backbone,jquerymobile

我正在运行的命令是这个：

$ java -classpath /Users/dixond/build-tools/rhino1_7R4/js.jar:/Users/dixond/build-tools/closurecompiler/compiler.jar org.mozilla.javascript.tools.shell.Main /Users/dixond/build-tools/r.js/dist/r.js -o /Users/dixond/Sites/omm_mobile/js/build.js

我的 build.js 文件长这样：

( {
    //appDir: "some/path/",
    baseUrl : ".",
    mainConfigFile : 'init.js',
    paths : {
        jquery : 'libs/jquery-1.8.3.min',
        backbone : 'libs/backbone.0.9.9',
        underscore : 'libs/underscore-1.4.3',
        json2 : 'libs/json2',
        jquerymobile : 'libs/jquery.mobile-1.2.0.min'
    },
    packages : [],
    shim : {
        jquery : {
            exports : 'jQuery'
        },
        jquerymobile : {
            deps : ['jquery'],
            exports : 'jQuery.mobile'
        },
        underscore : {
            exports : '_'
        },
        backbone : {
            deps : ['jquerymobile', 'jquery', 'underscore'],
            exports : 'Backbone'
        }
    },
    keepBuildDir : true,
    locale : "en-us",
    optimize : "closure",
    skipDirOptimize : false,
    generateSourceMaps : false,
    normalizeDirDefines : "skip",
    uglify : {
        toplevel : true,
        ascii_only : true,
        beautify : true,
        max_line_length : 1000,
        defines : {
            DEBUG : ['name', 'false']
        },


        no_mangle : true
    },
    uglify2 : {},
    closure : {
        CompilerOptions : {},
        CompilationLevel : 'SIMPLE_OPTIMIZATIONS',
        loggingLevel : 'WARNING'
    },
    cssImportIgnore : null,
    inlineText : true,
    useStrict : false,
    pragmas : {
        fooExclude : true
    },
    pragmasOnSave : {
        //Just an example
        excludeCoffeeScript : true
    },
    has : {
        'function-bind' : true,
        'string-trim' : false
    },
    hasOnSave : {
        'function-bind' : true,
        'string-trim' : false
    },
    //namespace: 'foo',
    skipPragmas : false,
    skipModuleInsertion : false,
    optimizeAllPluginResources : false,
    findNestedDependencies : false,
    removeCombined : false,
    name : "init",
    out : "main-built.js",
    wrap : {
        start : "(function() {",
        end : "}());"
    },
    preserveLicenseComments : true,
    logLevel : 0,
    cjsTranslate : true,
    useSourceUrl : true
})

我的init.js长这样：

 requirejs.config({
      //libraries
      paths: {
          jquery:       'libs/jquery-1.8.3.min',
          backbone:     'libs/backbone.0.9.9',
          underscore:   'libs/underscore-1.4.3',
          json2 :       'libs/json2',
          jquerymobile: 'libs/jquery.mobile-1.2.0.min'
      },

      //shimming enables loading non-AMD modules
      //define dependencies and an export object
      shim: {
          jquerymobile: {
              deps: ['jquery'],
              exports: 'jQuery.mobile'
          },
          underscore: {
              exports: '_'
          },
          backbone: {
              deps: ['jquerymobile', 'jquery', 'underscore', 'json2'],
              exports: 'Backbone'
          }
      }
    });


requirejs(["backbone",], function(Backbone) {
    //Execute code here
});

在这个构建过程中，我做错了什么？

- Devin Dixon

我有同样的问题，但只在Chrome中发生，在你的情况下也是这样吗？ - Lucas Roselli

7个回答

43

错误

我最近在使用 requireJS 的 angularJS 项目中遇到了一个非常相似的问题。

我正在使用 Chrome 预发布版 (Version 34.0.1801.0 canary)，但也安装了一个稳定版本 (Version 32.0.1700.77)，当使用 开发人员控制台 加载应用程序时，显示完全相同的问题:

Uncaught Error: Load timeout for modules

开发者控制台在这里起到关键作用，因为当控制台关闭时，我并没有收到错误提示。我试过重置所有Chrome设置，卸载任何插件......但目前仍无法解决问题。

解决方案

一个Google小组讨论（参见下面的资源）提供了重要的指针，即waitSeconds配置选项。将其设置为0解决了我的问题。我不会将其纳入代码中，因为这样只会将超时设置为无限。但是在开发过程中，这是一个很好的修复方法。示例配置:

<script src="scripts/require.js"></script>
<script>
  require.config({
    baseUrl: "/another/path",
    paths: {
      "some": "some/v1.0"
    },
    waitSeconds: 0
  });
  require( ["some/module", "my/module", "a.js", "b.js"],
    function(someModule,    myModule) {
      //This function will be called when all the dependencies
      //listed above are loaded. Note that this function could
      //be called before the page is loaded.
      //This callback is optional.
    }
  );
</script>

导致该错误的其他常见原因包括：

模块内部错误
配置中路径设置有误（请检查paths和baseUrl选项）
配置文件中存在重复的条目

更多资源

requireJS的故障排除页面：http://requirejs.org/docs/errors.html#timeout，其中第2、3和4点可能会对您有用。

类似的SO问题：Ripple - Uncaught Error: Load timeout for modules: app http://requirejs.org/docs/errors.html#timeout

相关的Google Groups讨论：https://groups.google.com/forum/#!topic/requirejs/70HQXxNylYg

- hcpl

将超时设置为无限大非常好，因为它可以避免我们设置一个精确的超时上限。谢谢。 - jsbisht

18

如果其他人遇到这个问题并仍在苦苦挣扎（就像我一样），那么这个问题也可能来自循环依赖，例如A依赖于B，而B依赖于A。 RequireJS文档没有提到循环依赖可能会导致“加载超时”错误，但我现在已经观察到了两个不同的循环依赖。

- Aaron

2

你是如何识别循环问题的？你是否需要逐个查看每个定义的模块？ - Paul Redmond

1

当我添加和更改一些模块时，出现了问题，所以我能够浏览这些更改，追踪哪些添加的依赖项创建了循环依赖关系，并将它们删除。 - Aaron

2

xrayquire（由requirejs开发的工具）可以检查循环依赖。 - Druska

当在另一个模块B中引用模块A时，在回调函数中加载模块A时会观察到此现象。 - Jochen Bedersdorfer

17

waitSeconds的默认值为7（7秒）

若设置为0，则完全禁用超时。

来源：http://requirejs.org/docs/api.html

- Eduscho

2

问题的原因是 Require.js 由于项目可能有大型库的依赖而超时。默认超时时间为7秒。当然，增加此配置选项（称为waitSeconds）的值可以解决此问题，但这并不是正确的方法。正确的方法是 改善页面加载时间。加速页面加载的最佳技术之一是 代码压缩 - 即压缩代码的过程。有一些很好的代码压缩工具，如r.js或webpack。

- Lyudmyla

0

只有在移动Safari 6.0.0（iOS 6.1.4）上运行测试时才会出现此错误。waitSeconds: 0 现在已经为我提供了一个成功的构建。如果我的构建再次失败，我会进行更新。

- Adam Spence

0

简而言之：

使用两个有效的不同名称，可能是以下两个之一：

绝对路径：'/path/to/file.js'
相对路径：'./path/to/file.js'
作为模块：'path/to/file'
作为主路径配置上的模块：

paths: { 'my/module/file' : '/path/to/file' }

最近我也遇到了同样的问题。我批量更改了一些 require 路径，所以我知道问题出在哪里。

我可以清楚地看到服务器端日志和网络调试选项卡中的文件在不到一秒钟的时间内被提供。这不是真正的超时问题。

我尝试使用建议的 xrayrequire 查找任何循环依赖关系，但没有成功。我查找了冲突文件的 requires，并发现我使用不同的名称两次要求它。

- Noman_1

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Mike Barlow - BarDev · Accepted Answer

Require.js有一个名为waitSeconds的配置选项，这可能会有所帮助。

RequireJS waitSeconds

以下是使用waitSeconds的示例：

requirejs.config({
    baseUrl: "scripts",
    enforceDefine: true,
    urlArgs: "bust=" + (new Date()).getTime(),
    waitSeconds: 200,
    paths: {
        "jquery": "libs/jquery-1.8.3",
        "underscore": "libs/underscore",
        "backbone": "libs/backbone"
    },
    shim: {
        "underscore": {
            deps: [],
            exports: "_"
        },
        "backbone": {
            deps: ["jquery", "underscore"],
            exports: "Backbone"
        },
    }
});

define(["jquery", "underscore", "backbone"],
    function ($, _, Backbone) {
        console.log("Test output");
        console.log("$: " + typeof $);
        console.log("_: " + typeof _);
        console.log("Backbone: " + typeof Backbone);
    }
);