0

我是 RequireJS 的新手,但似乎碰壁了。

麻烦从我的“app”模块开始。我不确定如何告诉 RequireJS 加载我的叶子模块——依赖于“app”的包。

我想我明白为什么 - 因为系统中没有任何东西依赖于它们并且它们没有在任何地方注册,但我需要处理这种情况。

我怎样才能让 RequireJS 知道这些模块并适当地加载它们?

干杯

//index.html
....
<script data-main="app/config" src="/assets/js/libs/require.js"></script>
....

//config.js
require.config({
    deps: [ "app" ],
    paths: {
        libs: "../assets/js/libs",
        plugins: "../assets/js/plugins",
        jquery: "../assets/js/libs/jquery",
        underscore: "../assets/js/libs/underscore",
        backbone: "../assets/js/libs/backbone",
        marionette: "../assets/js/libs/backbone.marionette"
    }
});

//app.js
require(
    [ "jquery", "underscore", "backbone", "marionette" ],
    function ( $, _, Backbone, Marionette ) {
        //....
    }
);

//app.view.js
require(
    [ "jquery", "underscore", "backbone", "marionette", "app" ], 
    function ( $, _, Backbone, Marionette, App ) {
        //....
    }
);

//app.route.js 
require(
    [ "backbone", "app" ], 
    function ( Backbone, App ) {
        //....
    }
);

因此:

  • app.js 依赖于“jquery”、“underscore”、“backbone”、“marionette”
  • app.view.js 依赖于 "jquery", "underscore", "backbone",
  • "marionette", "app" app.route.js 依赖于 "backbone", "app"
4

2 回答 2

2

如文档中所述 - > http://requirejs.org/docs/api.html#config 依赖项在 deps 数组中定义。它们是运行 require.js 时首先加载的东西,它实际上主要用于在加载 require.js 之前必须定义依赖项时。

这就是你的结构应该是什么样子

//config.js
require.config({
    paths: {
        libs: "../assets/js/libs",
        plugins: "../assets/js/plugins",
        jquery: "../assets/js/libs/jquery",
        underscore: "../assets/js/libs/underscore",
        backbone: "../assets/js/libs/backbone",
        marionette: "../assets/js/libs/backbone.marionette"
    }
});

require(['app']);

//app.js
define(
    [ "jquery", "underscore", "backbone", "marionette" ],
    function ( $, _, Backbone, Marionette ) {
        //....
    }
);

//app.view.js
define(
    [ "jquery", "underscore", "backbone", "marionette", "app" ], 
    function ( $, _, Backbone, Marionette, App ) {
        //....
    }
);

//app.route.js 
define(
    [ "backbone", "app" ], 
    function ( Backbone, App ) {
        //....
    }
);

请记住,您的所有库和模块都需要与 AMD 兼容,如果您想将 app 用作 app.view.js 中的路径,那么您需要将其定义为一个。与 egis 相同,因为如果在 require.config 中未将它们定义为路径,则无法加载像这样的模块 ["Backbone", "App"]。

于 2012-05-24T09:28:32.637 回答
1

这就是我的启动方式:

// main.js
define(["jquery", "app", "router"], function ($, App) {
  "use strict";
  // domReady plugin maybe best used here?
  $(function() {
    App.start();
  });
});

// app.js
define(["backbone", "marionette"], function (Backbone) {
  "use strict";
  var app = new Backbone.Marionette.Application();
  app.on("initialize:after", function(options){
    if (Backbone.history){
      Backbone.history.start();
    }
  });

  return app;
});

// router.js
define(["backbone", "controller", "marionette"], function(Backbone, controller) {
  "use strict";
  var Router = Backbone.Marionette.AppRouter.extend({
    appRoutes: {
        "": "index"
    }
  });
  return new Router({
    controller: controller
  });
});

// controller.js
define(["view"], function(View) {
  return {
    "index": {
      new View(); // Do what you like here…
    }
  }
});

// view.js
define(["backbone"], function(Backbone) {
  // view here
});

我假设对 router.js 的依赖可以放在 app.js 上,但基本上对 Backbone.history.start() 的调用需要加载路由器。路由器依赖于控制器。它是控制器,它具有对它所使用的视图等的所有依赖项。可能有模型和集合等。

希望有帮助。

于 2012-07-05T23:28:12.067 回答