Backbone.js and Require.js

Question

I want to create Backbone.js app with Require.js. But I have an error in console: Uncaught Error: Module name "underscore" has not been loaded yet for context: _. Use require([])

require.config({
        baseUrl: 'js/',
        paths : {
            'jquery' : 'jquery',
            'underscore' : 'underscore',
            'backbone' : 'backbone',
            shim: {
                'underscore': {
                    exports: '_'
                },
                'backbone': {
                    deps: ['underscore', 'jquery'],
                    exports: 'Backbone'
                }

            }
        }
    });

    define('app', ['jquery','backbone', 'underscore'], function ($, Backbone, _){

        var Model = Backbone.model.extend({});
        var model = new Model;
    });

    require(['app','jquery', 'backbone', 'underscore']);

How I can resolve this problem?

try changing the order in define call to `jquery, underscore, backbone` — coding_idiot, Feb 01 '15 at 10:46
possible duplicate of [Trouble combining Require.js and Backbone.js/Underscore.js](http://stackoverflow.com/questions/16774214/trouble-combining-require-js-and-backbone-js-underscore-js) — Louis, Feb 01 '15 at 11:21

score 1 · Answer 1 · answered Feb 01 '15 at 11:12

1

The shim is mentioned inside the paths object. I am not sure if that is the problem, but wanted to mention that here.

answered Feb 01 '15 at 11:12

Kumaran

41
4

Peter Wagener · Accepted Answer · 2015-02-07T02:42:21.510

You still need to list underscore as a part of paths so you can refer to it in the shims. Also, not sure what your directory structure looks like, but I'm writing this with the assumption that library code is in the /js/libs directory). Finally, note you won't need to require any of the dependencies of app -- the joy of RequireJS is that it'll figure out what to load.

So...

require.config({
    baseUrl: 'js/',
    paths : {
        'jquery' : 'lib/jquery',
        'underscore' : 'lib/underscore',
        'backbone' : 'lib/backbone',
    },
    shim: {
        'underscore': {
            exports: '_'
        },
       'backbone': {
            deps: ['underscore', 'jquery'],
            exports: 'Backbone'
        }

    }
});

define('app', ['jquery','backbone', 'underscore'], function ($, Backbone, _){
    var Model = Backbone.Model.extend({});
    var model = new Model({
        foo: 'bar'
    });

    var app = {
        model: model
    };

    // ...

    return app;
});

require(['app'], function(App) {
    App.model.get('foo'); // <<=== returns 'bar'
});

Excellent! Thank you very much. But one correction: `App.model.get('foo'); ` — Alexander Seredenko, Feb 04 '15 at 11:54
Edited to match the example. Thanks for accepting the answer! — Peter Wagener, Feb 07 '15 at 02:42

score -1 · Answer 3 · answered Jan 31 '15 at 16:08

-1

You need Underscore.js as listed in your require statement.

answered Jan 31 '15 at 16:08

Will

546
5
16

Oh. I don't understand you. Can you show an example? – Alexander Seredenko Jan 31 '15 at 16:10
`require(['app','jquery', 'backbone', 'underscore']);` requires Underscore.js. Download and link to it as you would any other JS file. – Will Jan 31 '15 at 16:11
I've downloaded Underscore.js. It is in folder with other scripts. – Alexander Seredenko Jan 31 '15 at 16:13

Backbone.js and Require.js

3 Answers3