Backbone，Marionette，RequireJS應用程序啓動

Question

我正在構建一個包含Backbone，Marionette和RequireJS的應用程序，如果應用程序啓動可以以任何方式進行改進/改進，我希望由一些更有經驗的人員運行。

文件夾結構：

index.html 
js/ 
    collections/ 
    libs/ 
    backbone.js 
    marionette.js 
    require.js 
    ... 
    models/ 
    views/ 
    app.js 
    init.js 
    router.js 

目前應用程序的引導如下。

index.html的requireJS入口點定義爲：

<script data-main="js/init" src="js/libs/require.js"></script> 

init.js確實的RequireJS配置和：

require(['app'], function(App){ 
    App.start(); 
}); 

該應用模塊中app.js：

App = new Backbone.Marionette.Application(); 

App.addInitializer(function (options) { 
    // initialize the Router; will only setup the routes and corresponding callbacks; not history.start() 
    App.router = new Router(); 
    // initialize Marionette regions 
    App.addRegions({ 
    'header': '#header', 
    'main': '#main', 
    'footer': '#footer' 
    }); 
}); 

App.on('start', function(options) { 
    Backbone.history && Backbone.history.start() || console.error('No "Backbone.history" to .start()'); 
}); 

return App; 

路由器模塊在router.js：

return Backbone.Router.extend({ 
    routes: {  
     'panel/:handle': 'showPanel', 
    }, 

    showPanel: function (handle) { 
     require(['app'], function (App) { 
     App.main.show(new Panel_v({userHandle: handle})); 
     }); 
    }  
}); 

有沒有辦法讓路由器模塊更少卷積？我以這種方式解決了App-> Router-> App形成的循環依賴問題。

其他建議？

Answer 1

我已經來到這個解決方案最近，在main.js文件中加入了App和路由器：

App.js

define(['marionette'], function(Marionette) { 
    var App; 
    App = new Backbone.Marionette.Application(); 
    App.vars = {}; 
    App.addRegions({ 
    headerRegion: "#header-region", 
    mainRegion: "#main-region", 
    footerRegion: "#footer-region", 
    dialogsRegion: "#dialogs" 
    }); 
    App.vent.on("routing:started", function() { 
    Backbone.history.start(); 
    }); 
    return App; 
}); 

Router.js

define(['marionette', 'app'], function(Marionette, App) { 
     var appRouter, routerController; 
     routerController = { 
     showViaggi: function() { 
      return require(['modules/viaggi/viaggi'], function(Viaggi) { 
      App.Modules.viaggi = new Viaggi(); 
      return App.Modules.viaggi.start(); 
      }); 
     } 
     }; 
     return appRouter = Backbone.Marionette.AppRouter.extend({ 
     appRoutes: { 
      'viaggi': 'showViaggi' 
     }, 
     controller: routerController 
     }); 
    }); 

而且Main.js，我的初始腳本加載了Require.js

define(['app', 'routers/appRouter'], function(App,appRouter) { 
    App.addInitializer(function() { 
    App.Router = new appRouter; 
    return App.vent.trigger("routing:started"); 
    }); 
    return App.start(); 
});