Best way to traverse Webpack modules tree downwards

Question

I'm working on some Webpack related projects in which I need to analyse the whole modules tree.

Currently I'am traversing upwards, using the module.reasons property, which has all the modules that are parents of the current module. However, I can't find the analog property containing child modules.

I'm basing the traversing algorithm on Webpack's Module class, because it should be able to perform the recursion on any kind of module. (All module instances of any other class extending Module )

While testing, I saw a module.dependencies property, but it is not defined in Module constructor and I couldn't find how it is populated.

Any idea on how can I traverse downwards? Is there some other property that I'm missing? Or should I access the tree using a different Webpack interface and not directly from inside Module instances?

UPDATE:

I'm using module.dependencies because I've confirmed that somehow it is present on every module. However, it only lists static dependencies (EX: import {something} from 'some/module.js' ), but not dynamic ones (even if resolvable) like ( import('some/module.js') ). Any help would be highly appreciated. Thanks.

Answer 1

After further analysing Webpack's source code I have found that module.blocks property holds a reference for every parsed 'internal dependency block' (internal declarations and assignments) inside the module, including dynamic import() statements.

module.blocks is an array of block objects. Each block has a block.dependencies property which is an array of dependency objects.

You are interested in the dependency objects which are instances of ImportDependency .

Something like this:

function getAllChildModules(module) {
    const childModules = [];

    // GET STATIC CHILD MODULES
    module.dependencies.forEach((dep) => {
        childModules.push(dep.module);
    });

    // GET DYNAMIC CHILD MODULES
    module.blocks.forEach((blk) => {
        blk.dependencies.forEach((dep) => {
            if (dep.constructor.name === 'ImportDependency') {
                childModules.push(dep.module);
            }
        });
    });

    return childModules;
}

Confirmation here .