Pass asynchronously loaded data to pug-html-loader in webpack

the default pattern for this situation looks like:

const configPromise = new Promise(function(resolve, reject) {
  setTimeout(() => { resolve(webpackConfig) }, 1000);
});

configPromise
  .then(webpack) // Passes the config to webpack
  .then(compiler => {
    // Do the work with the compiler
  });

The feature is well documented in DOCS.

Webpack will run the function exported by the configuration file and wait for a Promise to be returned. Handy when you need to asynchronously load configuration variables.

module.exports = () => {
  return new Promise((resolve, reject) => { // The promise could be an XHR call using fetch, Axios or whatever
    setTimeout(() => { 
      resolve({ // Resolve webpack config
        entry: './app.js',
        /* ... */
      });
    }, 5000);
  });
};