RequireJS dependency not defined

Question

I am trying to load a util.js file that I've created in a separate utils folder into my Backbone application, but no matter what configuration I use for RequireJS, the file is loaded by Require (as I can see it in the dev tools as loaded), but is always undefined in the view itself. As far as I can tell I seem to have defined the file correctly and have tried all different combinations of RequireJS configuration - defining the path in the paths var, defining paths and a shim that exports the name, not defining it in the require config at all but just declaring the path directly in the view define, but it is always undefined.

My folder structure is:


js
 - views
 - controllers
 (etc)
 - utils
   - util.js

The file I'm trying to load is this:

util.js


define(function() {
    return {
        showMessage: function() {
            console.log('show message');
        }
    }; 
});

And like I said I've tried all kinds of Require configs. For example, currently I have:


require.config({
    paths : {
        underscore : 'lib/lodash',
        backbone   : 'lib/backbone-1.0.0',
        marionette : 'lib/backbone.marionette-1.1.0',
        jquery     : 'lib/jquery-2.0.3.min',
        //jquery     : 'lib/jquery-2.0.3',
        tpl        : 'lib/tpl',
        pnotify    : 'lib/jquery.pnotify',
        utils      : 'utils/util'
    },
    shim : {
        'lib/backbone-localStorage' : ['backbone'],
        underscore: {
            exports: '_'
        },
        backbone: {
            exports: 'Backbone',
            deps: ['jquery','underscore']
        },
        marionette: {
            exports: 'Backbone.Marionette',
            deps: ['jquery', 'underscore', 'backbone']
        },
        pnotify: ['jquery'],
        utils: {
            exports: 'utils'  
        } 
    }
});

require(['app'],function(app){
    app.start();
});

And in the calling view I have (modified to just show utils import):

define([
    'utils'
], function (utils) {
    "use strict";

return Marionette.Controller.extend({ 
    initialize: function() {
        console.log(utils); // undefined
    }
});

});

All of my other backbone code (views, models, collections, etc) load fine but I just can't get this file to load. What am I missing here?

Chad Chad · Accepted Answer · 2014-04-14T18:52:23

you shouldn't need the shim definition. The path declaration should cover your use case.

The shim that you defined tells requirejs that it should look for a global named 'utils' to provide to any module that lists utils/util.js as a dependency. Since you are using requirejs syntax in your utils/util.js and not creating a global, the shim should not be necessary.

RequireJS dependency not defined

1 Answers