I've been working on a project that has more front end scripting than I'm used to, and I decided to use RequireJS to keep it organized. After mucking around all night, I'm still having some issues where certain dependencies seem to load after the fact.

For instance, Sammy needs jQuery to work. Refreshing my app results in a 'Sammy, function undefined' sort of error. Is the Require function executing before jQuery is loaded?

Require config:

    require.config({
        paths: {
            'jquery': 'vendor/jquery.2.min',
            'sammy': 'vendor/sammy',
        },
        shim: {
            'jquery': {
                debs: [],
                exports: '$'
            },
            'sammy': {
                debs: ['jquery'],
                exports: 'Sammy'
            }
            ...

As for my navigation:

define([
    'jquery',
    'sammy'
], function($, Sammy) {

    return Sammy(function() {
    ...

In about 10 percent of my tests, upon hitting the Sammy function, the app poops out with the following:

Uncaught ReferenceError: jQuery is not defined sammy.js:2120
Uncaught TypeError: undefined is not a function 

The RequireJS way of working mystifies me. What am I missing?

I've been working on a project that has more front end scripting than I'm used to, and I decided to use RequireJS to keep it organized. After mucking around all night, I'm still having some issues where certain dependencies seem to load after the fact.

For instance, Sammy needs jQuery to work. Refreshing my app results in a 'Sammy, function undefined' sort of error. Is the Require function executing before jQuery is loaded?

Require config:

    require.config({
        paths: {
            'jquery': 'vendor/jquery.2.min',
            'sammy': 'vendor/sammy',
        },
        shim: {
            'jquery': {
                debs: [],
                exports: '$'
            },
            'sammy': {
                debs: ['jquery'],
                exports: 'Sammy'
            }
            ...

As for my navigation:

define([
    'jquery',
    'sammy'
], function($, Sammy) {

    return Sammy(function() {
    ...

In about 10 percent of my tests, upon hitting the Sammy function, the app poops out with the following:

Uncaught ReferenceError: jQuery is not defined sammy.js:2120
Uncaught TypeError: undefined is not a function 

The RequireJS way of working mystifies me. What am I missing?

• javascript
• requirejs

• 5 Is debs: ['jquery'] a typo? Should be deps requirejs/docs/api.html#config – jgillich Commented Apr 24, 2013 at 17:37
• 1 You can also use the require-jquery.js, which has jQuery included and will always load it before anything else: requirejs/docs/jquery.html – jgillich Commented Apr 24, 2013 at 17:41
• 2 'organised' wasn't a typo. Leave en_GB alone! ;) – Paul Grime Commented Apr 24, 2013 at 17:44
• 1 Sometimes you really need a second pair of eyes... Why not post it as an answer? I'll accept it if works – Jorg Commented Apr 24, 2013 at 17:45
• 1 @Paul Grime en_AU ;-) – Jorg Commented Apr 24, 2013 at 17:47

1 Answer 1

You have a typo in your configuration, the correct property name would be deps instead of debs as specified in the documentation.

'jquery': {
    deps: [],
    exports: '$'
},
'sammy': {
    deps: ['jquery'],
    exports: 'Sammy'
}