feat!: minimum supported webpack version is 5.0.0 (#1389)

Author: snitin315

.github/workflows/nodejs.yml

@@ -64,10 +64,6 @@ jobs:
         os: [ubuntu-latest, windows-latest, macos-latest]
         node-version: [14.x, 16.x, 18.x, 19.x]
         webpack-version: [latest]
-        include:
-          - node-version: 16.x
-            os: ubuntu-latest
-            webpack-version: 4
 
     runs-on: ${{ matrix.os }}
 
@@ -83,10 +79,6 @@ jobs:
       - name: Install dependencies
         run: npm ci
 
-      - name: Install webpack ${{ matrix.webpack-version }}
-        if: matrix.webpack-version == '4'
-        run: npm i webpack@${{ matrix.webpack-version }}
-
       - name: Run tests for webpack version ${{ matrix.webpack-version }}
         run: npm run test:coverage -- --ci
 

package-lock.json

@@ -44,7 +44,7 @@
     "types"
   ],
   "peerDependencies": {
-    "webpack": "^4.0.0 || ^5.0.0"
+    "webpack": "^5.0.0"
   },
   "dependencies": {
     "colorette": "^2.0.10",

package.json

@@ -1,4 +1,3 @@
-const webpack = require("webpack");
 const { isColorSupported } = require("colorette");
 
 /** @typedef {import("webpack").Configuration} Configuration */
@@ -12,8 +11,6 @@ const { isColorSupported } = require("colorette");
 /** @typedef {Configuration["stats"]} StatsOptions */
 /** @typedef {{ children: Configuration["stats"][] }} MultiStatsOptions */
 /** @typedef {Exclude<Configuration["stats"], boolean | string | undefined>} NormalizedStatsOptions */
-// TODO remove `color` after dropping webpack v4
-/** @typedef {{ children: StatsOptions[], colors?: any }} MultiNormalizedStatsOptions */
 
 /**
  * @template {IncomingMessage} Request
@@ -33,31 +30,11 @@ function setupHooks(context) {
     context.stats = undefined;
   }
 
-  // @ts-ignore
-  const statsForWebpack4 = webpack.Stats && webpack.Stats.presetToOptions;
-
   /**
    * @param {Configuration["stats"]} statsOptions
    * @returns {NormalizedStatsOptions}
    */
   function normalizeStatsOptions(statsOptions) {
-    if (statsForWebpack4) {
-      if (typeof statsOptions === "undefined") {
-        // eslint-disable-next-line no-param-reassign
-        statsOptions = {};
-      } else if (
-        typeof statsOptions === "boolean" ||
-        typeof statsOptions === "string"
-      ) {
-        // @ts-ignore
-        // eslint-disable-next-line no-param-reassign
-        statsOptions = webpack.Stats.presetToOptions(statsOptions);
-      }
-
-      // @ts-ignore
-      return statsOptions;
-    }
-
     if (typeof statsOptions === "undefined") {
       // eslint-disable-next-line no-param-reassign
       statsOptions = { preset: "normal" };
@@ -99,7 +76,7 @@ function setupHooks(context) {
       );
 
       /**
-       * @type {StatsOptions | MultiStatsOptions | NormalizedStatsOptions | MultiNormalizedStatsOptions}
+       * @type {StatsOptions | MultiStatsOptions | NormalizedStatsOptions}
        */
       let statsOptions;
 
@@ -122,7 +99,7 @@ function setupHooks(context) {
       }
 
       if (isMultiCompilerMode) {
-        /** @type {MultiNormalizedStatsOptions} */
+        /** @type {MultiStatsOptions} */
         (statsOptions).children =
           /** @type {MultiStatsOptions} */
           (statsOptions).children.map(
@@ -153,24 +130,6 @@ function setupHooks(context) {
         }
       }
 
-      // TODO webpack@4 doesn't support `{ children: [{ colors: true }, { colors: true }] }` for stats
-      if (
-        /** @type {MultiCompiler} */
-        (compiler).compilers &&
-        statsForWebpack4
-      ) {
-        /** @type {MultiNormalizedStatsOptions} */
-        (statsOptions).colors =
-          /** @type {MultiNormalizedStatsOptions} */
-          (statsOptions).children.some(
-            /**
-             * @param {StatsOptions} child
-             */
-            // @ts-ignore
-            (child) => child.colors
-          );
-      }
-
       const printedStats = stats.toString(statsOptions);
 
       // Avoid extra empty line when `stats: 'none'`

src/utils/setupHooks.js

@@ -1,5 +1,3 @@
-const path = require("path");
-
 const memfs = require("memfs");
 
 /** @typedef {import("webpack").MultiCompiler} MultiCompiler */
@@ -17,27 +15,9 @@ function setupOutputFileSystem(context) {
   if (context.options.outputFileSystem) {
     const { outputFileSystem: outputFileSystemFromOptions } = context.options;
 
-    // Todo remove when we drop webpack@4 support
-    if (typeof outputFileSystemFromOptions.join !== "function") {
-      throw new Error(
-        "Invalid options: options.outputFileSystem.join() method is expected"
-      );
-    }
-
-    // Todo remove when we drop webpack@4 support
-    // @ts-ignore
-    if (typeof outputFileSystemFromOptions.mkdirp !== "function") {
-      throw new Error(
-        "Invalid options: options.outputFileSystem.mkdirp() method is expected"
-      );
-    }
-
     outputFileSystem = outputFileSystemFromOptions;
   } else {
     outputFileSystem = memfs.createFsFromVolume(new memfs.Volume());
-    // TODO: remove when we drop webpack@4 support
-    // @ts-ignore
-    outputFileSystem.join = path.join.bind(path);
   }
 
   const compilers =

src/utils/setupOutputFileSystem.js

@@ -3106,8 +3106,6 @@ describe.each([
           expect(new instance.context.outputFileSystem.Stats()).toBeInstanceOf(
             Stats
           );
-          expect(compiler.outputFileSystem).toHaveProperty("join");
-          expect(compiler.outputFileSystem).toHaveProperty("mkdirp");
         });
       });
 
@@ -3221,38 +3219,6 @@ describe.each([
           expect(instance.context.outputFileSystem).toHaveProperty("mkdirp");
         });
       });
-
-      describe("should throw an error on the invalid fs value - no join method", () => {
-        it("should throw an error", () => {
-          expect(() => {
-            const compiler = getCompiler(webpackConfig);
-
-            middleware(compiler, {
-              outputFileSystem: {
-                mkdirp: () => {},
-              },
-            });
-          }).toThrow(
-            "Invalid options: options.outputFileSystem.join() method is expected"
-          );
-        });
-      });
-
-      describe("should throw an error on the invalid fs value - no mkdirp method", () => {
-        it("should throw an error", () => {
-          expect(() => {
-            const compiler = getCompiler(webpackConfig);
-
-            middleware(compiler, {
-              outputFileSystem: {
-                join: () => {},
-              },
-            });
-          }).toThrow(
-            "Invalid options: options.outputFileSystem.mkdirp() method is expected"
-          );
-        });
-      });
     });
 
     describe("index option", () => {

test/middleware.test.js

@@ -26,8 +26,6 @@ describe("setupOutputFileSystem", () => {
     // make sure that this is the default fs created
     expect(context.compiler.outputFileSystem.testFs).toBeTruthy();
     expect(context.outputFileSystem.testFs).toBeTruthy();
-    // the join value of the fs is set for webpack@4
-    expect(context.outputFileSystem.join).toBeTruthy();
     expect(createFsFromVolume.mock.calls.length).toEqual(1);
   });
 
@@ -46,34 +44,6 @@ describe("setupOutputFileSystem", () => {
     });
   });
 
-  it("should throw on provided fs without join method", () => {
-    const context = {
-      compiler: {},
-      options: {
-        outputFileSystem: {},
-      },
-    };
-
-    expect(() => {
-      setupOutputFileSystem(context);
-    }).toThrow(/join/);
-  });
-
-  it("should throw on provided fs without mkdirp method", () => {
-    const context = {
-      compiler: {},
-      options: {
-        outputFileSystem: {
-          join: () => {},
-        },
-      },
-    };
-
-    expect(() => {
-      setupOutputFileSystem(context);
-    }).toThrow(/mkdirp/);
-  });
-
   it("should use provided fs with correct methods", () => {
     const context = {
       compiler: {},

test/utils/setupOutputFileSystem.test.js

@@ -10,7 +10,6 @@ export = setupHooks;
 /** @typedef {Configuration["stats"]} StatsOptions */
 /** @typedef {{ children: Configuration["stats"][] }} MultiStatsOptions */
 /** @typedef {Exclude<Configuration["stats"], boolean | string | undefined>} NormalizedStatsOptions */
-/** @typedef {{ children: StatsOptions[], colors?: any }} MultiNormalizedStatsOptions */
 /**
  * @template {IncomingMessage} Request
  * @template {ServerResponse} Response
@@ -32,7 +31,6 @@ declare namespace setupHooks {
     StatsOptions,
     MultiStatsOptions,
     NormalizedStatsOptions,
-    MultiNormalizedStatsOptions,
   };
 }
 type Configuration = import("webpack").Configuration;
@@ -50,7 +48,3 @@ type NormalizedStatsOptions = Exclude<
   Configuration["stats"],
   boolean | string | undefined
 >;
-type MultiNormalizedStatsOptions = {
-  children: StatsOptions[];
-  colors?: any;
-};