refactor!: update minimum required NodeJS version (#4668)

Author: alexander-akait

.github/workflows/nodejs.yml

@@ -61,7 +61,7 @@ jobs:
       fail-fast: true
       matrix:
         os: [ubuntu-latest, windows-latest, macos-latest]
-        node-version: [18.x, 20.x, 22.x, 24.x]
+        node-version: [20.x, 22.x, 24.x, 25.x]
         webpack-version: [latest]
         dev-server-version: [latest]
 

package-lock.json

@@ -59,7 +59,7 @@
     "concat-stream": "^2.0.0",
     "cspell": "^9.4.0",
     "css-loader": "^7.1.2",
-    "del-cli": "^6.0.0",
+    "del-cli": "^7.0.0",
     "eslint": "^9.29.0",
     "eslint-config-webpack": "^4.5.0",
     "execa": "^9.6.1",
@@ -87,6 +87,6 @@
     "webpack": "5.x.x"
   },
   "engines": {
-    "node": ">=18.12.0"
+    "node": ">=20.9.0"
   }
 }

package.json

@@ -52,6 +52,6 @@
     "@types/ejs": "^3.1.5"
   },
   "engines": {
-    "node": ">=18.12.0"
+    "node": ">=20.9.0"
   }
 }

packages/create-webpack-app/package.json

@@ -3,10 +3,9 @@
   "exclude": ["src/utils/__tests__"],
   "compilerOptions": {
     "outDir": "lib",
-    "rootDir": "src",
-    "module": "esnext"
+    "rootDir": "src"
   },
-  "include": ["src"],
+  "include": ["./src"],
   "references": [
     {
       "path": "../webpack-cli"

packages/create-webpack-app/tsconfig.json

@@ -62,7 +62,7 @@
     }
   },
   "engines": {
-    "node": ">=18.12.0"
+    "node": ">=20.9.0"
   },
   "gitHead": "fb50f766851f500ca12867a2aa9de81fa6e368f9"
 }

packages/webpack-cli/package.json

@@ -11,7 +11,8 @@ export default class CLIPlugin {
   }
 
   async setupBundleAnalyzerPlugin(compiler: Compiler) {
-    const { BundleAnalyzerPlugin } = require("webpack-bundle-analyzer");
+    // @ts-expect-error No types right now
+    const { BundleAnalyzerPlugin } = (await import("webpack-bundle-analyzer")).default;
 
     const bundleAnalyzerPlugin = compiler.options.plugins.some(
       (plugin) => plugin instanceof BundleAnalyzerPlugin,
@@ -25,7 +26,7 @@ export default class CLIPlugin {
   static #progressStates: [number, ...string[]][] = [];
 
   setupProgressPlugin(compiler: Compiler) {
-    const { ProgressPlugin } = compiler.webpack || require("webpack");
+    const { ProgressPlugin } = compiler.webpack;
     const progressPlugin = compiler.options.plugins.some(
       (plugin) => plugin instanceof ProgressPlugin,
     );

packages/webpack-cli/src/plugins/cli-plugin.ts

@@ -47,7 +47,7 @@ interface IWebpackCLI {
   capitalizeFirstLetter: StringFormatter;
   checkPackageExists(packageName: string): boolean;
   getAvailablePackageManagers(): PackageManager[];
-  getDefaultPackageManager(): PackageManager | undefined;
+  getDefaultPackageManager(): Promise<PackageManager | undefined>;
   doInstall(packageName: string, options?: PackageInstallOptions): Promise<string>;
   loadJSONFile<T = unknown>(path: Path, handleError: boolean): Promise<T>;
   tryRequireThenImport<T = unknown>(module: ModuleName, handleError: boolean): Promise<T>;

packages/webpack-cli/src/types.ts

@@ -226,6 +226,7 @@ class WebpackCLI implements IWebpackCLI {
     return false;
   }
 
+  // TODO remove me
   getAvailablePackageManagers(): PackageManager[] {
     const { sync } = require("cross-spawn");
 
@@ -252,9 +253,10 @@ class WebpackCLI implements IWebpackCLI {
     return availableInstallers;
   }
 
-  getDefaultPackageManager(): PackageManager | undefined {
-    const { sync } = require("cross-spawn");
+  async getDefaultPackageManager(): Promise<PackageManager | undefined> {
+    const { sync } = await import("cross-spawn");
 
+    // TODO use async methods
     const hasLocalNpm = fs.existsSync(path.resolve(process.cwd(), "package-lock.json"));
 
     if (hasLocalNpm) {
@@ -307,7 +309,7 @@ class WebpackCLI implements IWebpackCLI {
   }
 
   async doInstall(packageName: string, options: PackageInstallOptions = {}): Promise<string> {
-    const packageManager = this.getDefaultPackageManager();
+    const packageManager = await this.getDefaultPackageManager();
 
     if (!packageManager) {
       this.logger.error("Can't find package manager");
@@ -319,10 +321,10 @@ class WebpackCLI implements IWebpackCLI {
       options.preMessage();
     }
 
-    const prompt = ({ message, defaultResponse, stream }: PromptOptions) => {
-      const readline = require("node:readline");
+    const { createInterface } = await import("node:readline");
 
-      const rl = readline.createInterface({
+    const prompt = ({ message, defaultResponse, stream }: PromptOptions) => {
+      const rl = createInterface({
         input: process.stdin,
         output: stream,
       });
@@ -470,6 +472,7 @@ class WebpackCLI implements IWebpackCLI {
     return result || {};
   }
 
+  // TODO remove me
   loadJSONFile<T = unknown>(pathToFile: Path, handleError = true): T {
     let result;
 
@@ -559,7 +562,7 @@ class WebpackCLI implements IWebpackCLI {
 
     defaultInformation.npmPackages = `{${defaultPackages.map((item) => `*${item}*`).join(",")}}`;
 
-    const envinfo = await import("envinfo");
+    const envinfo = (await import("envinfo")).default;
 
     let info = await envinfo.run(defaultInformation, envinfoConfig);
 
@@ -1231,8 +1234,8 @@ class WebpackCLI implements IWebpackCLI {
         },
       );
     } else if (this.#isCommand(commandName, WebpackCLI.#commands.serve)) {
-      const loadDevServerOptions = () => {
-        const devServer = require(WEBPACK_DEV_SERVER_PACKAGE);
+      const loadDevServerOptions = async () => {
+        const devServer = (await import(WEBPACK_DEV_SERVER_PACKAGE)).default;
 
         const options: Record<string, WebpackCLIBuiltInOption> = this.webpack.cli.getArguments(
           devServer.schema,
@@ -1253,7 +1256,7 @@ class WebpackCLI implements IWebpackCLI {
           let devServerOptions = [];
 
           try {
-            devServerOptions = loadDevServerOptions();
+            devServerOptions = await loadDevServerOptions();
           } catch (error) {
             this.logger.error(
               `You need to install 'webpack-dev-server' for running 'webpack serve'.\n${error}`,
@@ -1270,7 +1273,7 @@ class WebpackCLI implements IWebpackCLI {
           let devServerFlags: WebpackCLIBuiltInOption[] = [];
 
           try {
-            devServerFlags = loadDevServerOptions();
+            devServerFlags = await loadDevServerOptions();
           } catch {
             // Nothing, to prevent future updates
           }
@@ -1312,7 +1315,19 @@ class WebpackCLI implements IWebpackCLI {
             return;
           }
 
-          const servers: (typeof DevServer)[] = [];
+          type DevServerConstructor = typeof import("webpack-dev-server");
+          let DevServer: DevServerConstructor;
+
+          try {
+            DevServer = (await import(WEBPACK_DEV_SERVER_PACKAGE)).default;
+          } catch (err) {
+            this.logger.error(
+              `You need to install 'webpack-dev-server' for running 'webpack serve'.\n${err}`,
+            );
+            process.exit(2);
+          }
+
+          const servers: InstanceType<DevServerConstructor>[] = [];
 
           if (this.needWatchStdin(compiler)) {
             process.stdin.on("end", () => {
@@ -1323,18 +1338,6 @@ class WebpackCLI implements IWebpackCLI {
             process.stdin.resume();
           }
 
-          const DevServer = require(WEBPACK_DEV_SERVER_PACKAGE);
-
-          try {
-            // eslint-disable-next-line @typescript-eslint/no-unused-expressions
-            require(`${WEBPACK_DEV_SERVER_PACKAGE}/package.json`).version;
-          } catch (err) {
-            this.logger.error(
-              `You need to install 'webpack-dev-server' for running 'webpack serve'.\n${err}`,
-            );
-            process.exit(2);
-          }
-
           const compilers = this.isMultipleCompiler(compiler) ? compiler.compilers : [compiler];
           const possibleCompilers = compilers.filter((compiler) => compiler.options.devServer);
           const compilersForDevServer =
@@ -1426,7 +1429,7 @@ class WebpackCLI implements IWebpackCLI {
 
               await server.start();
 
-              servers.push(server);
+              servers.push(server as unknown as InstanceType<DevServerConstructor>);
             } catch (error) {
               if (this.isValidationError(error as Error)) {
                 this.logger.error((error as Error).message);
@@ -2483,7 +2486,7 @@ class WebpackCLI implements IWebpackCLI {
       process.exit(2);
     }
 
-    const CLIPlugin = (await import("./plugins/cli-plugin.js")).default;
+    const { default: CLIPlugin } = (await import("./plugins/cli-plugin.js")).default;
 
     const internalBuildConfig = (item: Configuration) => {
       const originalWatchValue = item.watch;

packages/webpack-cli/src/webpack-cli.ts

@@ -5,7 +5,7 @@ const CLI = require("../../packages/webpack-cli/lib/webpack-cli");
 
 const readlineQuestionMock = jest.fn();
 
-jest.mock("node:readline", () => ({
+jest.unstable_mockModule("node:readline", () => ({
   createInterface: jest.fn().mockReturnValue({
     question: readlineQuestionMock,
     close: jest.fn().mockReturnValue(undefined),
@@ -34,7 +34,7 @@ describe("doInstall", () => {
 
   it("should prompt to install using npm if npm is package manager", async () => {
     readlineQuestionMock.mockImplementation((_questionTest, cb) => cb("y"));
-    getDefaultPackageManagerSpy.mockReturnValue("npm");
+    getDefaultPackageManagerSpy.mockResolvedValue("npm");
 
     const installResult = await cli.doInstall("test-package");