javascript - Circular Dependencies for a web app using backbone.marionette and requireJs - Stack Overflow

admin管理员组

文章数量:1317894

I am in the following situation.

I am using requireJs to loads module and I don't want to use global variables.

The main.js is responsible to load the router.
Then the router loads the app and the app loads several subApps.

After everything has been initialised, the subApps needs the router for making router.navigate.

Here the schema:

main.js -> router -> app -> subApp -> router

Then I have a problem of Circular Dependencies and for that reason the router in subApp will be undefined.

What is the best way to reorganise my code or to fix this problem? Are there some example about this?

I am in the following situation.

I am using requireJs to loads module and I don't want to use global variables.

The main.js is responsible to load the router.
Then the router loads the app and the app loads several subApps.

After everything has been initialised, the subApps needs the router for making router.navigate.

Here the schema:

main.js -> router -> app -> subApp -> router

Then I have a problem of Circular Dependencies and for that reason the router in subApp will be undefined.

What is the best way to reorganise my code or to fix this problem? Are there some example about this?

• javascript
• backbone.js
• requirejs
• marionette
• backbone-routing

Share Improve this question Follow edited Jul 5, 2012 at 13:34 Lorraine Bernard asked Jun 29, 2012 at 16:11 Lorraine BernardLorraine Bernard 13.4k2323 gold badges8585 silver badges138138 bronze badges 2

• i thought requirejs was supposed to handle circular dependencies correctly... (i honestly don't know. i'm not a fan of requirejs) – Derick Bailey Commented Jun 30, 2012 at 16:21
• Nope, it doesn't. It doesn't event tell you it's a circular dependency - things just stop working and some references bee undefined. – Tony Abou-Assaleh Commented Jun 30, 2012 at 20:52

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 5

the schema:

 main.js -> router -> app -> subApp -> router

is right.

If you are using backbone.marionette, in order to access the router from the app and subApp, without using global var, you should start the app in router in this way:

---

// router.js
YourApp.start(router: router);

---

// app.js
YourApp.addInitializer(function(options){
  // do useful stuff here
  var myView = new MyView({
    router: options.router
  });
  YourApp.mainRegion.show(myView);
});

Subapp can raise events which router handles rather than having an explicit dependency on router

In my project, I use the following dependency: main.js -> app -> router -> subApp.

In app.js, I create a single global variable that holds a pointer to my app:

define([...], function(...) {
return {
  initialize: function() {
    window.MyApp = new Backbone.Marionette.Application();
    // ...
    MyApp.start();
  }
};
});

This makes it extremely easy to access my app's regions from anywhere, as well as store global state information in one name space.

I tried doing it without the global app at first, but eventually gave up and found this approach to be a lot more flexible.

本文标签： javascriptCircular Dependencies for a web app using backbonemarionette and requireJsStack Overflow