fix: fix comments

Author: wood1986

.gitignore

@@ -3,3 +3,4 @@
 /samples
 node_modules
 npm-debug.log
+.DS_Store

src/BundleAnalyzerPlugin.js

@@ -28,18 +28,15 @@ class BundleAnalyzerPlugin {
     };
 
     this.server = null;
+    this.logger = new Logger(this.opts.logLevel);
   }
 
   apply(compiler) {
-    const isFromWebpackDevServer = process.env.WEBPACK_SERVE === 'true';
-
     this.compiler = compiler;
 
-    this.logger = require('webpack/lib/logging/runtime')?.getLogger(PLUGIN_NAME)
-      || new Logger(this.opts.logLevel);
-
     const done = (stats, callback) => {
-      this.fs = isFromWebpackDevServer ? compiler.outputFileSystem : require('fs');
+      const isWebpack5 = compiler.webpack;
+      this.fs = isWebpack5 ? compiler.outputFileSystem : require('fs');
       callback = callback || (() => {});
 
       const actions = [];
@@ -77,6 +74,9 @@ class BundleAnalyzerPlugin {
     };
 
     if (compiler.hooks) {
+      compiler.hooks.compilation.tap(PLUGIN_NAME, (compilation) => {
+        this.logger = compilation.getLogger(PLUGIN_NAME);
+      });
       compiler.hooks.done.tapAsync(PLUGIN_NAME, done);
     } else {
       compiler.plugin('done', done);

src/viewer.js

@@ -145,7 +145,10 @@ async function generateReport(bundleStats, opts) {
   });
   const reportFilepath = path.resolve(bundleDir || process.cwd(), reportFilename);
 
-  fs.mkdirSync(path.dirname(reportFilepath), {recursive: true});
+  // older version webpack uses memory-fs whose mkdirSync does not support {recursive: true}
+  fs.mkdirpSync
+    ? fs.mkdirpSync(path.dirname(reportFilepath))
+    : fs.mkdirSync(path.dirname(reportFilepath), {recursive: true});
   fs.writeFileSync(reportFilepath, reportHtml);
 
   logger.info(`${bold('Webpack Bundle Analyzer')} saved report to ${bold(reportFilepath)}`);
@@ -162,8 +165,11 @@ async function generateJSONReport(bundleStats, opts) {
 
   if (!chartData) return;
 
-  await fs.promises.mkdir(path.dirname(reportFilename), {recursive: true});
-  await fs.promises.writeFile(reportFilename, JSON.stringify(chartData));
+  // older version webpack uses memory-fs whose mkdirSync does not support {recursive: true}
+  fs.mkdirpSync
+    ? fs.mkdirpSync(path.dirname(reportFilename))
+    : fs.mkdirSync(path.dirname(reportFilename), {recursive: true});
+  fs.writeFileSync(reportFilename, JSON.stringify(chartData));
 
   logger.info(`${bold('Webpack Bundle Analyzer')} saved JSON report to ${bold(reportFilename)}`);
 }

test/dev-server.js

@@ -1,42 +1,58 @@
 const fs = require('fs');
-const {spawn} = require('child_process');
-
-const del = require('del');
-
 const ROOT = `${__dirname}/dev-server`;
 const WEBPACK_CONFIG_PATH = `${ROOT}/webpack.config.js`;
 const webpackConfig = require(WEBPACK_CONFIG_PATH);
+const DevServer = require('webpack-dev-server');
+const webpack = require('webpack');
 
 describe('Webpack Dev Server', function () {
-  beforeAll(deleteOutputDirectory);
-  afterEach(deleteOutputDirectory);
-
-  const timeout = 15000;
-  jest.setTimeout(timeout);
-
-  it('should save report file to the output directory', function (done) {
-    const startedAt = Date.now();
-
-    const devServer = spawn(`${__dirname}/../node_modules/.bin/webpack-dev-server`, ['--config', WEBPACK_CONFIG_PATH], {
-      cwd: ROOT
+  it('should save report file to memory file system when writeToDisk is empty', async function () {
+    expect.assertions(2);
+    const compiler = webpack(webpackConfig);
+    const devServer = await new Promise((resolve) => {
+      const devServerOptions = {host: '127.0.0.1', port: 8080};
+      const devServer = new DevServer(compiler, devServerOptions);
+      devServer.listen(devServerOptions.port, devServerOptions.host, () => {
+        resolve(devServer);
+      });
+    });
+    await new Promise((resolve) => {
+      compiler.hooks.afterDone.tap('webpack-bundle-analyzer', resolve);
+    });
+    const path = `${webpackConfig.output.path}/report.html`;
+    expect(compiler.outputFileSystem.existsSync(path)).toBeTruthy();
+    expect(fs.existsSync(path)).toBeFalsy();
+    compiler.outputFileSystem.unlinkSync(path);
+    await new Promise((resolve) => {
+      devServer.close(() => {
+        resolve();
+      });
     });
 
-    const reportCheckIntervalId = setInterval(() => {
-      if (fs.existsSync(`${webpackConfig.output.path}/report.html`)) {
-        finish();
-      } else if (Date.now() - startedAt > timeout - 1000) {
-        finish(`report file wasn't found in "${webpackConfig.output.path}" directory`);
-      }
-    }, 300);
+  });
 
-    function finish(errorMessage) {
-      clearInterval(reportCheckIntervalId);
-      devServer.kill();
-      done(errorMessage ? new Error(errorMessage) : null);
-    }
+  it('should save report file to the output directory when writeToDisk is true', async function () {
+    expect.assertions(2);
+    const compiler = webpack(webpackConfig);
+    const devServer = await new Promise((resolve) => {
+      const devServerOptions = {host: '127.0.0.1', port: 8080, writeToDisk: true};
+      const devServer = new DevServer(compiler, devServerOptions);
+      devServer.listen(devServerOptions.port, devServerOptions.host, () => {
+        resolve(devServer);
+      });
+    });
+    await new Promise((resolve) => {
+      compiler.hooks.afterDone.tap('webpack-bundle-analyzer', resolve);
+    });
+    const path = `${webpackConfig.output.path}/report.html`;
+    expect(compiler.outputFileSystem.existsSync(path)).toBeTruthy();
+    expect(fs.existsSync(path)).toBeTruthy();
+    compiler.outputFileSystem.unlinkSync(path);
+    return await new Promise((resolve) => {
+      devServer.close(() => {
+        resolve();
+      });
+    });
   });
 });
 
-function deleteOutputDirectory() {
-  del.sync(webpackConfig.output.path);
-}