Question

我是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”，“下划线”，“骨干”，“木偶”
app.view.js取决于“jquery”，“下划线”，“骨干”，
“marionette”，“app”app.route.js取决于“骨干”，“app”

Answer 1

正如文档中所述 - ＆gt; 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”]的模块。

Answer 2

这是我启动的方式：

// 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（）的调用需要加载路由器。路由器依赖于控制器。它是控制器，它具有所使用的视图等的所有依赖关系。可能有模型和收藏品等。

希望有所帮助。

RequireJS加载叶子模块

2 个答案: