Trying to use a non-AMD module in require

Question

I'm trying to use a non-AMD JS module I have (called mymodule) in requirejs. This is the first time to try to do so. Following what I saw from bootstrap-amd, and underscore-amd, I tried the following:

// start of mymodule

if(typeof mymodule === "undefined") loaded = {};

mymodule.cache = (function() {

    ...

    return {
        ...
    };
})();

mymodule.main = (function() {

    ...

    return {
        doSomethingJQuery: function() { ... }
    }
})();

.
.
.

// end of mymodule


// This part I added for the sake of requirejs
if(typeof define === "function" && define.amd) {
    define(function() {
        return mymodule;
    });
}

You can see the first part is my module (using, I hope, good JS module pattern :). I wanted to keep the option of using the module independent from require JS so if I didn't want to use requirejs in another project, I don't have to. So I kinda didn't want to wrap the entire module in a define(...) function... unless it's common practise to have a mymodule.js and mymodule-amd.js files.

Anyway my module loads,

define(["mymodule"], function (mymodule) {

        // do it - ReferenceError: jQuery is not defined :(
        mymodule.doSomethingJQuery();
        .
        .
        .

..but as doSomethingJQuery() depends on jQuery, I get an error. How can I bring in jQuery here, or should it be done differently? I tried to find some examples but pretty new to requirejs. Would like to do things in the proper way. As mentioned, I'd like to also keep the option to use the module independently. Would appreciate any pointers here, thanks.

Answer 1

You need to make your module dependent on jQuery and pass the reference to a function that will define your module. Change the code that defines your module to:

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

The else part is necessary for cases that are not AMD because you're now using a factory function. (You could also have a branch to deal with CommonJS environments like Node but I'm not going to add it here.)

Then make a function that defines your module:

function factory($) {
    // define the module
    return mymodule;
}

The entire thing could be wrapped in an IIFE to avoid polluting the global space with factory.