module - Use requirejs and jquery, without clobbering global jquery?

Question

I'm using requirejs for the first time on a project. I'm working in an environment that has a lot of Javascript in place already, and I'm looking for clean ways to introduce my own code.

The problem I'm having is that I can't seem to find a module of jQuery that I can load that doesn't clobber existing jQuery.

I was surprised that even require-jquery.js introduces a global version of jQuery. Is there a way to load jQuery as a module without introducing any globals?

Answer 1

jQuery 1.7 supports AMD loading. But, the trick is avoiding a module naming conflict, since jQuery hardcodes its own module name as 'jquery'. If you are defining another module as 'jquery' (say, in the 'paths' property in your requirejs config), it will cause said conflict.

To load jQuery in your requirejs application scope, define a module, such as 'jquery-loader' and when you want to load jQuery, do it via 'jquery-loader':

define(['path/to/jquery.min'], function () {
    return jQuery.noConflict(true);
});

requirejs will 'cache' your reference to jQuery so that noConflict will only run the first time jquery-loader is loaded.