Use AMD loading with fallback to global vars

[kennknowles]

Hello,

I'm porting a project to use RequireJS so I added AMD support to this jquery plugin that I've been using. The change is unobtrusive and backwards compatible, so I hope you'll consider bringing it into the mainline.

I got the basic pattern from here: https://github.com/umdjs/umd/blob/master/jqueryPlugin.js

• Kenn

[brandonaaron]

Might want to add && define.amd.jQuery to the conditional as jQuery itself does.

[jpillora]

Require.js shim config is your friend.

Here's an example from one of my projects:

    shim: {
      'backbone': {
        deps: ['underscore', 'jquery'],
        exports: 'Backbone'
      },
      'bootstrap': ['jquery'],
      'lib/jquery.cookie': ['jquery'],
      'lib/jquery.color': ['jquery']
    }

[kennknowles]

Indeed, I am using a shim now. This patch would remove the need for a shim.

[jeffreymb]

I'll add my voice to the usefulness of this addition. Being AMD compatible would allow me to load it from cdnjs.com instead of having to compile it in.

[carhartl]

Thanks for the PR! Will add soon.

[carhartl]

@brandonaaron Out of interest, what is the effect of the additional check?

[pboling]

Excellent!

[chas-ryder]

It appears that this commit added support for requirejs, but it created issues with requirejs build. When running requirejs build, I get a jquery.cookie is undefined error at runtime.

[pboling]

Now that it is registering as an AMD module you likely need to add it as a dependency to your other scripts where it is used, if you are using RequireJS.

[chas-ryder]

That's what I am doing. The module is in fact the requirejs build code so the dependency is working, but it is having issue instantiating it. This is only when you do a compile/optimization. It works fine outside of that.

[pboling]

Are you loading it from a CDN? If so, and if it works when not compiled, then it might be a problem with the way r.js compiled external library dependencies. It has broken several times recently. Also if you are using almond.js to compile, then you cannot load it as an external dependency.

[chas-ryder]

Nope. It's local. This is the only plugin having issues. I am using a lot of other jquery plugins as well with no issue.

[pboling]

I wish I could be of more help then. I may attempt to use this plugin again soon, but am not currently.

[davyboyhayes]

I have come up against this problem, r.js is compiling the code incorrectly:

My shim:

shim: {
...
        jqueryCookie: ['jquery'],
...
    }

And the source currently shows

 if (typeof define === 'function' && define.amd) {
        // AMD
        define(['jquery'], factory);

But when it is run through r.js, it becomes:

 if (typeof define === 'function' && define.amd) {
        // AMD
        define('jqueryCookie',['jquery'], factory);

[davyboyhayes]

@chas-ryder I've created #306 as I've come across this issue as well.