Require.js为jquery / underscore / backbone / parse模块加载超时

时间:2012-06-05 18:25:28

标签: javascript backbone.js requirejs router

  

未捕获错误:模块的加载超时:order!libs / jquery / jquery-min   order!libs / underscore / underscore-min order!libs / parse / parse-min   libs / jquery / jquery-min libs / underscore / underscore-min   libs / parse / parse-min Backbone   http://requirejs.org/docs/errors.html#timeout

我在Chrome的“网络”标签下没有404请求,并且我没有脚本错误,因此我不在解决问题的常见错误/修复程序(根据requirejs.org)。

当我查看我的网络时,我看到脚本按以下顺序加载:

require.js
main.js
app.js <-- required by main.js
order.js <-- used in main.js to require the next 4 scripts (which aren't AMD)
jquery-min.js <-- required by main.js
underscore-min.js <-- required by main.js
backbone-min.js <-- required by main.js
parse-min.js <-- required by main.js
router.js
login.js
text.js

这对我来说似乎是对的。以下是我的main.jsapp.jsrouter.js的代码。

main.js:

// Author: Thomas Davis <thomasalwyndavis@gmail.com>
// Filename: main.js

// Require.js allows us to configure shortcut alias
// Their usage will become more apparent futher along in the tutorial.
require.config( {
    paths : {
        jQuery : 'libs/jquery/jquery-min',
        Underscore : 'libs/underscore/underscore-min',
        Backbone : 'libs/backbone/backbone-min',
        Parse : 'libs/parse/parse-min',
        templates : '../templates'
    }
});

require( [
    // Load our app module and pass it to our definition function
    'app',

    // Some plugins have to be loaded in order due to their non AMD compliance
    // Because these scripts are not "modules" they do not pass any values to the
    // definition function below
    'order!libs/jquery/jquery-min',
    'order!libs/underscore/underscore-min',
    'order!libs/backbone/backbone-min',
    'order!libs/parse/parse-min'
],
function(App) {
    // The "app" dependency is passed in as "App"
    // Again, the other dependencies passed in are not "AMD" therefore
    // don't pass a parameter to this function
    App.initialize();
});

app.js:

// Filename: app.js
define( [ 'jQuery', 'Underscore', 'Parse', 'router' ],
function($, _, Parse, Router) {
    var initialize = function() {

        Parse.$ = $;

        // Initialize Parse with your Parse application javascript keys
        Parse.initialize("HIDDEN", "ALSO HIDDEN");

        // Pass in our Router module and call it's initialize function
        Router.initialize();
    };

    return {
        initialize : initialize
    };
});

router.js:

// Filename: router.js
define( [ 'jQuery', 'Underscore', 'Backbone', 'Parse', 'views/home/login', ],
function($, _, Backbone, Parse, loginView) {
    var AppRouter = Backbone.Router.extend( {
        routes : {
            // Default
            '*actions' : 'defaultAction'
        },
        defaultAction : function(actions) {
            // We have no matching route, lets display the home page
            loginView.render();
        }
    });

    var initialize = function() {
        var app_router = new AppRouter;
        Backbone.history.start();
    };
    return {
        initialize : initialize
    };
});

3 个答案:

答案 0 :(得分:1)

尝试使用requirejs-jquery。它的requirejs版本已准备好与jquery一起使用并尝试使用shim config。

请参阅此链接:https://github.com/jrburke/require-jquery

Shim配置示例:

require.config({
  paths: {
    "jqueryUI": "libs/jquery-ui",
    "jquery": "libs/jquery-1.9.1",
    "underscore": "libs/underscore-min",
    "backbone": "libs/backbone-min"
  },
  shim: {
    jqueryUI:{
         deps: ["jquery"],
         exports:"$"
    },
    underscore: {
      exports: "_"
    },
    backbone: {
      deps: ["underscore", "jquery"],
      exports: "Backbone"
    }
  }

});

答案 1 :(得分:0)

我刚刚发布了一个开源工具包,可以帮助解决这个问题。它由许多开源工具组成,可以为您提供开箱即用的工作requirejs骨干应用程序。

它提供了单个命令来运行:dev web server,jasmine单浏览器测试运行器,jasmine js-test-driver多浏览器测试运行器,以及JavaScript和CSS的连接/缩小。它还会输出一个未经编辑的应用程序版本,用于生产调试,预编译车把模板,并支持国际化。

无需设置。它只是有效。

http://github.com/davidjnelson/agilejs

答案 2 :(得分:-8)

我切换到在我的main.js和我的index.html之外加载JS文件:

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.3.3/underscore-min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.0.0.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.2/backbone-min.js"></script>
<script data-main="js/main" src="js/libs/require/require.js"></script>