Router not working with require js and backbone

Question

Backbone version 1.1.2 Require version 2.0.2

//My main file

  require.config({
  paths: {
    jquery: 'assets/js/libs/jquery/jquery-1.9.1.min',
    underscore: 'assets/js/libs/underscore/underscore-min',
    backbone: 'assets/js/libs/backbone/backbone-min',
    bootstrap: 'assets/js/libs/bootstrap/bootstrap.min',
    text      : 'assets/js/libs/require/text',
    mustache: 'assets/js/libs/mustache/mustache'
  },
  shim: {
        'backbone': {
            deps: ['jquery','underscore'],
            exports: 'Backbone'
        },
        'bootstrap': {
            deps: ['jquery']
        }
  }

});

require([

  // Load our app module and pass it to our definition function
  'assets/js/app',
], function(App){

  App.initialize();

});

//My App file

define([
  'jquery',
  'underscore',
  'backbone',
  'assets/js/router'
], function($, _, Backbone, Router){
  var initialize = function(){

    Router.initialize();
 }

  return {
    initialize: initialize
  };
});

//My Router File

define([
  'jquery',
  'underscore',
  'backbone',
  'assets/js/views/trabajadores/list'
], function($, _, Backbone, TrabajadoresListView){

  var AppRouter = Backbone.Router.extend({

    routes:{

      '':'mostrarTrabajadores',
      'trabajadores': 'mostrarTrabajadores'
    },

    mostrarTrabajadores: function(){

      var trabajadoresListView = new TrabajadoresListView();
      trabajadoresListView.render();
    }

  });

  var initialize = function(){

    var app_router = new AppRouter; 
    Backbone.history.start();

  };

  return {
    initialize: initialize
  };

});

I'm a inspection the code and when the following code line executes "var app_router = new AppRouter; ", the console says: Uncaught TypeError: undefined is not a function.

The Router it's not working for me.why?

Can you post a full stack trace, and also your TrabajadoresListView? — Alex P

ganicus ganicus · Accepted Answer · 2015-03-19T21:00:13

You can declare your route actions inside the initialize method. Just use the following:

var initialize = function(){
  var app_router = new AppRouter;

  app_router.on('route:index', function() {
    console.log('index route');
  });

  return {
    initialize: initialize
  };

});

Just make sure you follow the format "route:Action" in the Router's 'on()' method.

Router not working with require js and backbone

1 Answers