RequireJS: Dynamic Dependencies Inside a Nested Module Request

Suppose there is a function that returns an array containing dynamic dependencies. Module B then uses these dependencies. Another module A, in turn, uses module B.

A.js

define([B], function(moduleB){
    moduleB.m();
})

B.js:

define([ dep1, dep2 ], function( dep1, dep2 ) {

    var dyndeps = dep2.getDynDeps();
    var moduleB = {}

    require(dyndeps, function() {
        moduleB.m = function() { ... };
    })

    return moduleB;

});

The problem with this approach is that the internal request is executed asynchronously, so the method m is not available on time.

+4
source share
1 answer

B.m , B , . plugins, , . rq ( Q promises), promise ( jquery, Q, RSVP ES6 promises), promiseme (?).

, B moduleB, . require moduleB. A <PLUGIN>!B. . promise jquery:

// A.js
define(["promise!B"], function(moduleB){
    // B is complete now
    moduleB.m();
})

// B.js
define([ "dep1", "dep2", "jquery" ], function( dep1, dep2, $ ) {

    var dyndeps = dep2.getDynDeps();
    var moduleB = {};
    var loaded = new $.Deferred();

    require(dyndeps, function() {
        moduleB.m = function() { ... };
        loaded.resolve(moduleB);
    })

    return loaded.promise();    
});

, (A.js) , B . B , :

// A.js
define(["B"], function(moduleB){
    moduleB.m();
})

// B.js
define([ "promise!dynamicB" ], function( moduleB ) {
    return moduleB;
});

// still inside B.js define a "private" named module:
define("dynamicB", ["dep1", "dep2", "jquery"], function() {
    var dyndeps = dep2.getDynDeps();
    var loaded = new $.Deferred();
    var moduleB = {};

    require(dyndeps, function() {
        moduleB.m = function() { ... };
        loaded.resolve(moduleB);
    })

    return loaded.promise();    
});

B , .

+9

All Articles