Question

I am using require in my app and on certain android devices and every now and again on the web I get an error like jQuery is not defined or Backbone not defined]

my index page is simple and has a link to my require

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

within here I setup all paths and the call the router as well as switching off the routing for JQM

require.config({

paths: {
    jquery:     'vendor/jqm/jquery_1.7_min',
    jqm:     'vendor/jqm/jquery.mobile-1.1.0', 
    underscore: 'vendor/underscore/underscore_amd',
    backbone:   'vendor/backbone/backbone_amd',
    text:       'vendor/require/text',
    templates:  '../templates',
    views:    '../views',
    models:       '../models'
}

});

define(['router','jqm-config'], function(app) {
});

then on my router page I define what is needed there..

define(['jquery', 'underscore', 'backbone','views/home/home',
        'models/products/productCollection',
        'views/products/productTypes',   
        'jqm'], 
function($, _, Backbone,HomeView,ProductsType,ProductListView ) {

       var AppRouter = Backbone.Router.extend({
        //code here
        });

$(document).ready(function () {
    console.log('App Loaded');
    app = new AppRouter();
    Backbone.history.start();
    });

    return AppRouter;
});

how do i stop these errors occuring?

Answer 1

In your require.config you could add a shim section to define those dependencies:

require.config({
  // The shim config allows us to configure dependencies for
  // scripts that do not call define() to register a module
  shim : {
    'underscore' : {
      exports : '_'
    },
    'backbone' : {
      deps : [ 'underscore', 'jquery' ],
      exports : 'Backbone'
    },
    'dataTables' : {
      deps : [ 'jquery' ],
      exports : 'dataTables'
    }
  },
  paths : {
...