Load modules automatically via requirejs

Question

I want to load jQuery plus a couple of plugins with requirejs. Setting up the config object "paths" and "shim" properties works. So from within TypeScript I can require jQuery and load the plugins via an amd-dependency.

Now I would like to minimize the code needed for loading jQuery and the plugins. Can I somehow tell requirejs "whenever jQuery is required, load it via the path that is given in the paths property. Then afterwards load the following plugins...".

Essentially this would allow me to require just jQuery. All plugins would also be loaded automatically.

Steve P · Accepted Answer · 2013-08-21 17:52:35Z

7

As you discovered, the shim config lets you define what gets loaded before a module, but there's no corresponding feature for loading something after a module. However, the overall approach to r.js optimization would have you bundling them all together in one file to save on load time. See the optimization section of shim example linked from the requirejs jquery doc page.

The other hack you might add on top of this is to just define your own module which loads the others:

require.config( {
    shim: {
        jquery: { exports: ['jQuery', '$'] },
        plugin1: { deps: ['jquery'] },
        plugin2: { deps: ['jquery'] }
    }
});

define('jquerywithplugins', ['jquery', 'plugin1', 'plugin2'], function(jq) {
    return jq;
});

And then later instead of require(['jquery']) you do require(['jquerywithplugins'])

answered Aug 21, 2013 at 17:52

Steve P

19.5k7 gold badges73 silver badges97 bronze badges

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

2 Comments

mgs Over a year ago

Loading jQuery plus the plugins works. However, when coding in TypeScript import $ = require("jquerywithplugins"), then $ is not known to be jQuery. So intellisense does not work.

mgs Over a year ago

Correction It is possible to code declare var $: JQueryStatic; after the above import. Then intellisense does work.

Collectives™ on Stack Overflow

Load modules automatically via requirejs

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related