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(); 
});