Магистраль, марионетка, запуск приложения RequireJS

Question

Я создаю приложение с базовой сетью, марионеткой и 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})); 
     }); 
    }  
}); 

Есть ли способ сделать модуль Router менее запутанным? Я разработал этот способ для решения проблемы циклической зависимости, созданной App-> Router-> App.

Любые другие предложения?

Answer 1

Я пришел к этому решению в последнее время, соединившись приложения и маршрутизатора в файле main.js:

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