refactor!: update minimum required NodeJS version

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;
 
@@ -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;
 
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const options: Record<string, any> = this.webpack.cli.getArguments(devServer.schema);
@@ -1254,7 +1257,7 @@ class WebpackCLI implements IWebpackCLI {
           this.webpack = await this.loadWebpack();
 
           try {
-            devServerFlags = loadDevServerOptions();
+            devServerFlags = await loadDevServerOptions();
           } catch (error) {
             this.logger.error(
               `You need to install 'webpack-dev-server' for running 'webpack serve'.\n${error}`,
@@ -1271,7 +1274,7 @@ class WebpackCLI implements IWebpackCLI {
           let devServerFlags = [];
 
           try {
-            devServerFlags = loadDevServerOptions();
+            devServerFlags = await loadDevServerOptions();
           } catch {
             // Nothing, to prevent future updates
           }
@@ -1327,7 +1330,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", () => {
@@ -1338,18 +1353,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 =
@@ -1444,7 +1447,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);
@@ -2501,7 +2504,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

@@ -2,17 +2,19 @@
   "exclude": ["node_modules", "lib", "__tests__"],
   "files": [],
   "compilerOptions": {
-    "skipLibCheck": true,
+    "lib": ["es2023"],
+    "module": "nodenext",
     "target": "ES2022",
-    "module": "commonjs",
-    "lib": ["ES2022"],
+
     "strict": true,
-    "rootDir": ".",
-    "outDir": "lib",
-    "moduleResolution": "node",
+    "esModuleInterop": true,
+    "skipLibCheck": true,
+    "moduleResolution": "nodenext",
     "resolveJsonModule": true,
     "allowSyntheticDefaultImports": true,
-    "esModuleInterop": true,
+
+    "rootDir": ".",
+    "outDir": "lib",
     "baseUrl": ".",
     "paths": {
       "@webpack-cli/*": ["packages/*/src"]