Non index root path with Marionette router

Question

I have to serve up my backbone app on the "/b" route and am having trouble hooking in my router. It works fine if I just showView a view, but my route controller functions are not firing when I hook in my router, any thoughts?

router:

define('appRouter', ['marionette', 'rootView', 'changePasswordView'], function(Marionette, rootView, changePasswordView) {
  return Marionette.AppRouter.extend({
    routes: {
      '/b/change-password': 'showChangePassword',
      '/b': 'showAccountSettings'
    },
    showChangePassword: function() {
      this.showView(new changePasswordView());
    },
    showAccountSettings: function() {
      this.showView(new rootView());
    }
  });
});

application onStart (which is confirmed firing):

 var Application = Marionette.Application.extend({

...

    onStart: function(options) {
      console.log('on start');
      var router = new appRouter(options);
      /** Starts the URL handling framework */
      if( ! Backbone.History.started) Backbone.history.start();
      router.initialize();
    }, 

...

});

When I visit http://localhost:8080/b (which is for all intensive purposes my index) it renders a blank page.

Answer 1

Default routes in Backbone are hash-based. Link to Your /b route should look like http://localhost:8080/#/b.

If You don't need hash-based links, start history with pushState: true.

Backbone.history.start({pushState: true});

EDIT:

If You serve app on /b path, then You have wrong defined routes. Routes must be defined relative to /b:

routes: {
  'change-password': 'showChangePassword',
  '': 'showAccountSettings'
},

And access:

• http://localhost:8080/b' -showAccountSettings`
• http://localhost:8080/b#change-password' -showChangePassword`