Question

Am using require.js to load backbone, and my other scripts, but i get an error saying backbone is not defined after the pages is reloaded.

I have the following script in my header

//App namespace
var MYU = MYU || {};
//configuration namespace
MYU.Config = MYU.Config || {};
//views namespace
MYU.Views = MYU.Views || {};
//controllers
MYU.Controller = MYU.Controller || {};
//configuration
MYU.Config = {
    site_url:"http://localhost/myunivacity/"
};

//Require.js configuration
require.config({
    paths : {
        'backbone': 'backbone',
        'underscore':'underscore',
        'text':'require/text',
        'myu':'myu'
    },
    baseUrl : MYU.Config.site_url+"assets/js"
});

And my main script is load via require.js

<script type="text/javascript" data-main="<?=$script ?>" src="<?=site_url() ?>assets/js/require/require.min.js"></script>

The $script variable holds a path to the script to be used on the current page

In the page am working with, the script is something like this

require(['underscore','backbone','controllers/cart','views/cart'], //Load dependecies
    function(){
      var cart = new MYU.Views.Cart();
    });

What could be the cause of the backbone being undefined

Answer 1

loading jquery, underscore and backbone in the right order is a bit tricky. i would recommend thomas davis’ approach: https://github.com/thomasdavis/backbonetutorials/tree/gh-pages/examples/modular-backbone