Make webpack's done hook wait until analyzer writes report / stat fil…

…e. (#247) * Make webpack's done hook wait until analyzer writes report / stat file. * Fix lint errors. * Fix "done" callback not being called when analyzer has no actions to run. * Integrate changes from review. #247 (review)
webpack-contrib · Feb 12, 2019 · 1c8aba3 · 1c8aba3
1 parent 1821812
commit 1c8aba3
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 32 deletions.
diff --git a/src/BundleAnalyzerPlugin.js b/src/BundleAnalyzerPlugin.js
@@ -33,7 +33,8 @@ class BundleAnalyzerPlugin {
   apply(compiler) {
     this.compiler = compiler;
 
-    const done = stats => {
+    const done = (stats, callback) => {
+      callback = callback || (() => {});
       stats = stats.toJson(this.opts.statsOptions);
 
       const actions = [];
@@ -55,14 +56,21 @@ class BundleAnalyzerPlugin {
 
       if (actions.length) {
         // Making analyzer logs to be after all webpack logs in the console
-        setImmediate(() => {
-          actions.forEach(action => action());
+        setImmediate(async () => {
+          try {
+            await Promise.all(actions.map(action => action()));
+            callback();
+          } catch (e) {
+            callback(e);
+          }
         });
+      } else {
+        callback();
       }
     };
 
     if (compiler.hooks) {
-      compiler.hooks.done.tap('webpack-bundle-analyzer', done);
+      compiler.hooks.done.tapAsync('webpack-bundle-analyzer', done);
     } else {
       compiler.plugin('done', done);
     }
@@ -108,8 +116,8 @@ class BundleAnalyzerPlugin {
     }
   }
 
-  generateStaticReport(stats) {
-    viewer.generateReport(stats, {
+  async generateStaticReport(stats) {
+    await viewer.generateReport(stats, {
       openBrowser: this.opts.openAnalyzer,
       reportFilename: path.resolve(this.compiler.outputPath, this.opts.reportFilename),
       bundleDir: this.getBundleDirFromCompiler(),

diff --git a/src/viewer.js b/src/viewer.js
@@ -111,7 +111,7 @@ async function startServer(bundleStats, opts) {
   }
 }
 
-function generateReport(bundleStats, opts) {
+async function generateReport(bundleStats, opts) {
   const {
     openBrowser = true,
     reportFilename = 'report.html',
@@ -125,32 +125,43 @@ function generateReport(bundleStats, opts) {
 
   if (!chartData) return;
 
-  ejs.renderFile(
-    `${projectRoot}/views/viewer.ejs`,
-    {
-      mode: 'static',
-      chartData: JSON.stringify(chartData),
-      assetContent: getAssetContent,
-      defaultSizes: JSON.stringify(defaultSizes),
-      enableWebSocket: false
-    },
-    (err, reportHtml) => {
-      if (err) return logger.error(err);
-
-      const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
-
-      mkdir.sync(path.dirname(reportFilepath));
-      fs.writeFileSync(reportFilepath, reportHtml);
-
-      logger.info(
-        `${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`
-      );
-
-      if (openBrowser) {
-        opener(`file://${reportFilepath}`);
+  await new Promise((resolve, reject) => {
+    ejs.renderFile(
+      `${projectRoot}/views/viewer.ejs`,
+      {
+        mode: 'static',
+        chartData: JSON.stringify(chartData),
+        assetContent: getAssetContent,
+        defaultSizes: JSON.stringify(defaultSizes),
+        enableWebSocket: false
+      },
+      (err, reportHtml) => {
+        try {
+          if (err) {
+            logger.error(err);
+            reject(err);
+            return;
+          }
+
+          const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
+
+          mkdir.sync(path.dirname(reportFilepath));
+          fs.writeFileSync(reportFilepath, reportHtml);
+
+          logger.info(
+            `${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`
+          );
+
+          if (openBrowser) {
+            opener(`file://${reportFilepath}`);
+          }
+          resolve();
+        } catch (e) {
+          reject(e);
+        }
       }
-    }
-  );
+    );
+  });
 }
 
 function getAssetContent(filename) {