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.

explunit explunit · Accepted Answer · 2013-08-21T17:52:35

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'])

Load modules automatically via requirejs

1 Answers