Make requireJs not reload jQuery if already on page

Question

I\'m writing a script that\'s meant to be embedded on 3rd party sites to add functionality to them. I recently ripped out my rather messy custom loader code and started repl

Answer 1

I had the same issue on a similar project, using require.js for a library intended to be loaded on 3rd-party sites. You can see my approach here, but here's the simplified version:

// check for existing jQuery
var jQuery = window.jQuery,
    // check for old versions of jQuery
    oldjQuery = jQuery && !!jQuery.fn.jquery.match(/^1\.[0-4](\.|$)/),
    localJqueryPath = libPath + 'jquery/jquery-1.7.2.min',
    paths = {},
    noConflict;

// check for jQuery 
if (!jQuery || oldjQuery) {
    // load if it's not available or doesn't meet min standards
    paths.jquery = localJqueryPath;
    noConflict = !!oldjQuery;
} else {
    // register the current jQuery
    define('jquery', [], function() { return jQuery; });
}

// set up require
require.config({
    paths: paths 
});

// load stuff
require(['jquery', ... ], function($, ...) {

    // deal with jQuery versions if necessary
    if (noConflict) $.noConflict(true);

    // etc

});

As you can see, this looks for jQuery, and then either defines the "jquery" module as a wrapper for the existing library, or (if there's no jQuery or if the existing jQuery is an old version) loads the library-specific jQuery with noConflict.

This works pretty well. The only downside is that you're calling require() dynamically within your script, which makes it more difficult to use the r.js optimizer effectively.

Answer 2

I had a similar issue.. My script was reloading jQuery twice .. Used the solution from the comments in this article

Worked like a charm !!

(Comment which worked was :

"I put it on my config file after the requirejs.config(...) and before the requirej(["app"]) and it worked")