lazy-compile-webpack-plugin/lib/loaders/module-loader.js

Lazy compile dynamic imports to boost your webpack startup time.

const path = require('path');
const loaderUtils = require('loader-utils');
const apiPath = path.join(__dirname, 'api.js');

module.exports = function() {
  const { activationUrl, ips, hmr } = loaderUtils.getOptions(this) || {};
  const hmrCode = `
if (module.hot) {
  module.hot.dispose(function() {
    stopAnimation();

    // wait for the module to install
    setTimeout(() => {
      // depressed warning: "unexpected require from disposed module"
      module.hot.active = true;
      compilation.ready(__webpack_require__(module.id));
      module.hot.active = false;
    }, 0);
  });
  module.hot.accept(function() {
    // error handle
  });
}
`.trim();

  const refreshCode = `
window.onbeforeunload = function() {
  stopAnimation();
}
`.trim();

  return `
//############################ NOTICE ############################//
//                                                                //
//           This is a placeholder module generated by            //
//                 lazy-compile-webpack-plugin.                   //
//     https://github.com/liximomo/lazy-compile-webpack-plugin    //
//                                                                //
//    The real content is in the corresponding hot-update file.   //
//           You won't see this after the page refresh.           //
//                                                                //
//################################################################//

// @activationUrl ${activationUrl}

// modified from https://matthewrayfield.com/articles/animating-urls-with-javascript-and-emojis
var api = require('!!${apiPath}');
var stopAnimation = api.startAnimation();
var compilation = api.compile(${JSON.stringify(ips)}, '${activationUrl}');

${hmr ? hmrCode : refreshCode}

module.exports = {
  then(resolve) {
    resolve(compilation)
  }
}
`.trim();
};