Is it a good idea to use conditional dependencies in AMD modules?

Question

I'm thinking of using conditions for specifying module dependendies in the AMD module system. For example to load libraryA on the browser and libraryB on the server.

This could look like this:

define([window?"libraryA":"libraryB"],function(library){
    //do some stuff
});

This would allow me to build an abstraction layer for 2 modules. But is this really a good idea? Are there any drawbacks in doing this?

Answer 1

That approach could cause problems for the build tool.

Update:

After further research, I find that config settings in your main JS file are not read by default by the optimizer. So, a cleaner solution would be to use a different map config for client and server.

Original:

A safer approach may be to define a module that adapts itself to the environment, thus keeping all the conditional code within your module definitions, and leaving all dependency lists in the most reliable format.

// dependent module
define(["libraryAB"], function (library) {
    //do some stuff
});


// libraryAB.js dependency module
define([], function () {

    return window ?
        defineLibraryA() :
        defineLibraryB();

});

You could alternatively keep the libraryA and libraryB code separate by defining libraryAB this way.

// libraryAB.js dependency module
define(["libraryA", "libraryB"], function (libraryA, libraryB) {

    return window ? libraryA : libraryB;

});

//define libraryA.js and libraryB.js as usual

If you want to avoid executing libraryA on the server or libraryB on the client, you could have these modules return functions and memoize the result if necessary.

The moral is that it's safest to keep all your non-standard code inside module definitions, keeping dependency lists nice and predictable.