Search code examples
javascriptrequirejsamd

Is there a way to conditional load a module via RequireJS based on whether or not the module 404s?


Problem: We currently have the following require.config:

require.config({
    paths: {
        lodash: '/embed/lodash',
        utils: '/embed/utils',
        analytics: '/external/analytics'
    }
});

file paths that start with embed are guaranteed to exist. file paths that start with external may or may not be available, depending on the environment. If I begin my main.js with the following:

require(['lodash', 'utils', 'analytics'], function (_, utils, analytics) {

and analytics can't be found, the whole thing crashes (as expected). Trying variations on the following proved fruitless:

require(['lodash', 'utils'], function (_, utils) {
    ...code and stuff
    $.ajax({ url: '/path/to/actual/file' })
        .done(function () {
            require(['analytics'], function (analytics) {
                // throws Mismatched anonymous define() module Error
            });
        })
        .fail(function () {
            // continue with stub of analytics
            // or not run analytics dependent code
        });

As per the title of this question: Is there a way to conditionally include a module in RequireJS based on whether or not the file is accessible?


Solution

  • From my colleague, who provided the correct solution to my problem, and kindly told me to RTFM: http://requirejs.org/docs/api.html#errbacks

    Keeping "normal" declaration of require.config, just add an error callback to handle the case when the module can't be found.

    require(['lodash', 'utils'], function (_, utils) {
        ...code and stuff
        require(['analytics'], function (analytics) {
            // normal execution
    
        }, function (error) {
            // continue with stub of analytics
            // or not run analytics dependent code at all
    
        });