CODEWITHSUNDEEP
javascriptrequirejsjs-amd
Nervetattoo
Nervetattoo

Reputation: 568

Dynamically load require.js modules under mixed base urls

We have an app using require.js, that at the same time allows extensions, and these extensions' js gets served from a different path. So in our config we have:

var require = {
  baseUrl : '/app/js/modules/'
}

But the extension is served from /extension/foo-extension/js/modules/. Also, extensions are dynamic to the point that they inject some html into the page that uses a data-module="foo/bar" which we pick up on to load that module.

Ideally we'd be able to pass / set a context for require.js that scoped the following module loads to be within baseUrl /extension/foo-extension/js/modules/. As far as I can tell we would need to do require('/extension/foo-extension/js/modules/foo/bar') to load foo/bar from foo-extension.

Here is some pseudo code to imagine where we need to handle setting the path / context:

define(['some-dep'], function(SomeDep) {
    $.get('somepage', function(html) {
        var extension = html.data('extension'); // "foo/bar"
        var extensionBase = html.data('extensionBase'); // extension/foo-extension/js/modules/

        // This is where we need to readjust require to use the base path for any foo module
    });
});

Is there another solution to this part from going the absolute path route?

Upvotes: 1

Views: 2801

Answers (2)

jrburke
jrburke

Reputation: 6766

requirejs.config() can be called later, at any time, and the loader will merge the configs together. So it should be enough to wait until you know what you want to use for the paths config for 'extension', then set it via another requirejs.config() call, then do the loading of the extension with that path.

Upvotes: 4

Russ
Russ

Reputation: 1951

It sounds like you'd want to use the "paths" configuration option. Example:

var require = {
  baseUrl : '/app/js/modules',
  paths   : {
    'extension' : '/extension/foo-extension/js/modules'  
  }
};

Then you could simply call require('extension/foo/bar') to load /app/js/modules/extension/foo-extension/js/modules/foo/bar.js

Upvotes: 2

Related Questions