jQuery and Underscore not loading in RequireJS

Question

I'm fairly new to Backbone and just started trying to learn AMD today. I installed the RequireJS-jQuery library from RequireJS's website. So this is my script tag, which has Laravel path calls in it:

<script data-main="{{ path('js/main') }}" 
src="{{ path('js/libs/requirejs/require-jquery.js') }}"></script>

I'm trying to make sure everything loads correctly, so I'm trying to console.log my dependencies. Backbone returns an object just fine. Underscore and jQuery do not. Here is my main.js file:

  require.config({
    baseUrl: '../js/',
    paths: {
        jquery: 'libs/jquery/jquery-1.8.3.min',
        underscore: 'libs/underscore/underscore-min',
        backbone: 'libs/backbone/backbone-min'
    }
});

if ( typeof define === "function" && define.amd && define.amd.jQuery ) {
  define( 'jquery', [], function () { return jQuery; } );
}

//the "main" function to bootstrap your code
require(['jquery', 'underscore', 'backbone', 'app'],
    function () {  
        var App = require('app');
        //App.initialize();
        console.log($);
        console.log(_);
        console.log(Backbone);
});

I have a couple of questions, do I need the path for jQuery, since it's part of the RequireJS-jQuery library? Two, what is this about shimming? Do I need to shim this to get it work? I'm using v 2.1.4 of RequireJS-jQuery.

I tried following this post but couldn't get it working. I'm using AMD versions of Backbone and Underscore. Why won't Underscore and jQuery console.log?

When I say they won't console.log what I mean is that it returns function() — sehummel
– sehummel, Commented Jan 24, 2013 at 19:57

Nirvana Tikku · Accepted Answer · 2013-01-24 20:27:59Z

2

When requiring any file via require.js, it must conform to the standard AMD definition in order for the IIFE to have an argument defined.

For example, in the jQuery library, they have added an export definition:

if ( typeof define === "function" && define.amd && define.amd.jQuery ) {
  define( "jquery", [], function () { return jQuery; } );
}

Which allows you to reference $ in the IIFE.

Shimming adds an export definition (similar to what jQuery has above), so if you wanted to you could have _, $ and Backbone point to the appropriate references... but personally, instead of relying on the arguments, I just rely on the evaluation globally, setup necessary shims for dependencies and otherwise, for all my own modules (where I do define each file as an AMD module), I use the inline require definition.

For example:

require(['jquery','underscore','backbone', 'my-module'],function(){
    var MyModule = require('my-module');
});

Hopefully the above made sense.

~ Based on your code above, try:

require(['jquery', 'underscore', 'backbone', 'app'],
    function () {  
        var App = require('app');
        //App.initialize();
        console.log($);
        console.log(_);
        console.log(Backbone);
});

edited Jan 24, 2013 at 20:27

answered Jan 24, 2013 at 20:10

Nirvana Tikku

4,2152 gold badges23 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

14 Comments

sehummel Over a year ago

I tried that and it didn't seem to work. jQuery is still not console.logging.

Nirvana Tikku Over a year ago

Well, my point was more so, instead of relying on the argument definitions in the anonymous function, use the inline definitions, and assume that the modules have been loaded. i.e. get rid of function ($, _, Backbone, App) and instead, assign App using an inline require definition of your 'App' i.e. require('app') and $ or jQuery should exist since you have required it.

sehummel Over a year ago

Can you edit my code to show me what you mean, I don't seem to be getting it.

sehummel Over a year ago

That's what I thought. I'm still not getting jQuery or Underscore.

sehummel Over a year ago

Could there be something else going on?

|

Collectives™ on Stack Overflow

jQuery and Underscore not loading in RequireJS

1 Answer 1

14 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

14 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related