refactor: change middleware interface

web-infra-dev · JSerFeng · Jun 16, 2025 · Mar 28, 2025 · May 18, 2025 · Jun 16, 2025
commit 2b855c7aca16753b4c84396850609c36cf1af082
diff --git a/packages/rspack-test-tools/etc/test-tools.api.md b/packages/rspack-test-tools/etc/test-tools.api.md
@@ -4,14 +4,14 @@
 
 ```ts
 
-import type { Compiler } from '@rspack/core';
+import { Compiler } from '@rspack/core';
 import type { Compiler as Compiler_2 } from 'webpack';
 import type { Configuration } from 'webpack';
 import type EventEmitter from 'node:events';
 import { IBasicGlobalContext as IBasicGlobalContext_2 } from '../../type';
 import { IBasicModuleScope as IBasicModuleScope_2 } from '../../type';
 import { ITestCompilerManager as ITestCompilerManager_2 } from '../type';
-import type { MultiCompiler } from '@rspack/core';
+import { MultiCompiler } from '@rspack/core';
 import type { MultiStats } from '@rspack/core';
 import type { MultiStats as MultiStats_2 } from 'webpack';
 import type { RspackOptions } from '@rspack/core';

@@ -1,7 +1,7 @@
 import { createServer } from "node:http";
 import type { Socket } from "node:net";
 import type { AddressInfo } from "node:net";
-    import type { Compiler, MultiCompiler } from "@rspack/core";
+import { type Compiler, MultiCompiler } from "@rspack/core";
 import { experiments } from "@rspack/core";
 
 export class LazyCompilationTestPlugin {
@@ -22,11 +22,16 @@ export class LazyCompilationTestPlugin {
 						: addr.family === "IPv6"
 							? `${protocol}://[${addr.address}]:${addr.port}`
 							: `${protocol}://${addr.address}:${addr.port}`;
-				middleware = experiments.lazyCompilationMiddleware(compiler, {
-					// @ts-expect-error cacheable is hidden config only for tests
-					cacheable: false,
-					serverUrl: urlBase
-				});
+				if (compiler instanceof MultiCompiler) {
+					for (const c of compiler.compilers) {
+						if (c.options.experiments.lazyCompilation) {
+							c.options.experiments.lazyCompilation.serverUrl = urlBase;
+						}
+					}
+				} else if (compiler.options.experiments.lazyCompilation) {
+					compiler.options.experiments.lazyCompilation.serverUrl = urlBase;
+				}
+				middleware = experiments.lazyCompilationMiddleware(compiler);
 
 				resolve(null);
 			});

@@ -4150,7 +4150,7 @@ interface LabeledStatement extends Node_4, HasSpan {
 export type Layer = string | null;
 
 // @public (undocumented)
-const lazyCompilationMiddleware: (compiler: Compiler | MultiCompiler, userOptions?: LazyCompilationOptions | boolean) => Middleware;
+const lazyCompilationMiddleware: (compiler: Compiler | MultiCompiler) => MiddlewareHandler;
 
 // @public
 export type LazyCompilationOptions = {

@@ -1,7 +1,7 @@
 import type { IncomingMessage, ServerResponse } from "node:http";
 import { type Compiler, MultiCompiler } from "../..";
 import type { LazyCompilationOptions } from "../../config";
-import type { Middleware } from "../../config/devServer";
+import type { MiddlewareHandler } from "../../config/devServer";
 import { BuiltinLazyCompilationPlugin } from "./lazyCompilation";
 
 export const LAZY_COMPILATION_PREFIX = "/lazy-compilation-using-";
@@ -37,20 +37,10 @@ const getFullServerUrl = ({ serverUrl, prefix }: LazyCompilationOptions) => {
 };
 
 export const lazyCompilationMiddleware = (
-	compiler: Compiler | MultiCompiler,
-	rawOptions?: LazyCompilationOptions | boolean
-): Middleware => {
-	let userOptions = rawOptions;
-	if (userOptions === false) {
-		return noop;
-	}
-
-	if (userOptions === true) {
-		userOptions = {};
-	}
-
+	compiler: Compiler | MultiCompiler
+): MiddlewareHandler => {
 	if (compiler instanceof MultiCompiler) {
-		const middlewareByCompiler: Map<string, Middleware> = new Map();
+		const middlewareByCompiler: Map<string, MiddlewareHandler> = new Map();
 
 		let i = 0;
 		for (const c of compiler.compilers) {
@@ -59,8 +49,7 @@ export const lazyCompilationMiddleware = (
 			}
 
 			const options = {
-				...c.options.experiments.lazyCompilation,
-				...userOptions
+				...c.options.experiments.lazyCompilation
 			};
 
 			const prefix = options.prefix || LAZY_COMPILATION_PREFIX;
@@ -78,40 +67,11 @@ export const lazyCompilationMiddleware = (
 				)
 			);
 
-			const compilerConfig = c.options.experiments.lazyCompilation
-				? c.options.experiments.lazyCompilation
-				: {};
-
-			const testConfig = compilerConfig.test ?? options.test;
-
-			const plugin = new BuiltinLazyCompilationPlugin(
-				({ module, path }) => {
-					const key = encodeURIComponent(
-						module.replace(/\\/g, "/").replace(/@/g, "_")
-					)
-						// module identifier may contain query, bang(!) or split(|),
-						// should do our best to ensure it's the same with which comes
-						// from server url
-						.replace(/%(2F|3A|24|26|2B|2C|3B|3D)/g, decodeURIComponent);
-					filesByKey.set(key, path);
-					const active = activeModules.get(key) === true;
-					return {
-						client: `${options.client || getDefaultClient(c)}?${encodeURIComponent(getFullServerUrl(options))}`,
-						data: key,
-						active
-					};
-				},
-				// @ts-expect-error internal option
-				compilerConfig.cacheable ?? options.cacheable ?? true,
-				compilerConfig.entries ?? options.entries ?? true,
-				compilerConfig.imports ?? options.imports ?? true,
-				testConfig
-			);
-			plugin.apply(c);
+			applyPlugin(c, options, activeModules, filesByKey);
 		}
 
 		const keys = [...middlewareByCompiler.keys()];
-		return (req: IncomingMessage, res: ServerResponse, next?: () => void) => {
+		return (req: IncomingMessage, res: ServerResponse, next: () => void) => {
 			const key = keys.find(key => req.url?.startsWith(key));
 			if (!key) {
 				return next?.();
@@ -123,17 +83,33 @@ export const lazyCompilationMiddleware = (
 		};
 	}
 
-	if (!compiler.options.experiments.lazyCompilation && !userOptions) {
+	if (!compiler.options.experiments.lazyCompilation) {
 		return noop;
 	}
 
 	const activeModules: Map<string, boolean> = new Map();
 	const filesByKey: Map<string, string> = new Map();
 
 	const options = {
-		...compiler.options.experiments.lazyCompilation,
-		...userOptions
+		...compiler.options.experiments.lazyCompilation
 	};
+	applyPlugin(compiler, options, activeModules, filesByKey);
+
+	const lazyCompilationPrefix = options.prefix || LAZY_COMPILATION_PREFIX;
+	return lazyCompilationMiddlewareInternal(
+		compiler,
+		activeModules,
+		filesByKey,
+		lazyCompilationPrefix
+	);
+};
+
+function applyPlugin(
+	compiler: Compiler,
+	options: LazyCompilationOptions,
+	activeModules: Map<string, boolean>,
+	filesByKey: Map<string, string>
+) {
 	const plugin = new BuiltinLazyCompilationPlugin(
 		({ module, path }) => {
 			const key = encodeURIComponent(
@@ -158,23 +134,15 @@ export const lazyCompilationMiddleware = (
 		options.test
 	);
 	plugin.apply(compiler);
-
-	const lazyCompilationPrefix = options.prefix || LAZY_COMPILATION_PREFIX;
-	return lazyCompilationMiddlewareInternal(
-		compiler,
-		activeModules,
-		filesByKey,
-		lazyCompilationPrefix
-	);
-};
+}
 
 // used for reuse code, do not export this
 const lazyCompilationMiddlewareInternal = (
 	compiler: Compiler | MultiCompiler,
 	activeModules: Map<string, boolean>,
 	filesByKey: Map<string, string>,
 	lazyCompilationPrefix: string
-): Middleware => {
+): MiddlewareHandler => {
 	const logger = compiler.getInfrastructureLogger("LazyCompilation");
 
 	return (req: IncomingMessage, res: ServerResponse, next?: () => void) => {

@@ -208,7 +208,7 @@ type DevMiddlewareContext<
 };
 type Server = any;
 
-type MiddlewareHandler<
+export type MiddlewareHandler<
 	RequestInternal extends Request = Request,
 	ResponseInternal extends Response = Response
 > = (

diff --git a/tests/e2e/fixtures/rspack.ts b/tests/e2e/fixtures/rspack.ts
@@ -36,7 +36,7 @@ class Rspack {
 		});
 		const DevServerConstructor = RspackDevServer;
 		if (compiler.options.experiments.lazyCompilation) {
-			const middleware = experiments.lazyCompilationMiddleware(compiler, compiler.options.experiments.lazyCompilation)
+			const middleware = experiments.lazyCompilationMiddleware(compiler)
 			compiler.options.devServer ??= {};
 			const setupMiddlewares = compiler.options.devServer.setupMiddlewares;
 			compiler.options.devServer.setupMiddlewares = (middlewares, server) => {
@@ -84,7 +84,7 @@ class Rspack {
 		const DevServerConstructor = RspackDevServer;
 
 		if (compiler.options.experiments.lazyCompilation) {
-			const middleware = experiments.lazyCompilationMiddleware(compiler, compiler.options.experiments.lazyCompilation)
+			const middleware = experiments.lazyCompilationMiddleware(compiler)
 			compiler.options.devServer ??= {};
 			const setupMiddleware = compiler.options.devServer.setupMiddlewares;
 			compiler.options.devServer.setupMiddlewares = (middlewares, server) => {

diff --git a/website/docs/en/guide/features/lazy-compilation.mdx b/website/docs/en/guide/features/lazy-compilation.mdx
@@ -107,10 +107,7 @@ import DevServer from 'webpack-dev-server';
 
 const compiler = rspack(config);
 
-const middleware = experiments.lazyCompilationMiddleware(
-  compiler,
-  config.experiments.lazyCompilation,
-);
+const middleware = experiments.lazyCompilationMiddleware(compiler);
 
 const server = new DevServer(
   {
@@ -125,10 +122,9 @@ const server = new DevServer(
 server.start();
 ```
 
-`lazyCompilationMiddleware` accepts two parameters:
+`lazyCompilationMiddleware` accepts one parameter:
 
 - `compiler`: The current [Compiler](/api/javascript-api/compiler) instance
-- `options`: The lazy compilation options, same as [experiments.lazyCompilation](/config/experiments#experimentslazycompilation)
 
 ## Customizing lazy compilation endpoint
 

diff --git a/website/docs/zh/guide/features/lazy-compilation.mdx b/website/docs/zh/guide/features/lazy-compilation.mdx
@@ -107,10 +107,7 @@ import DevServer from 'webpack-dev-server';
 
 const compiler = rspack(config);
 
-const middleware = experiments.lazyCompilationMiddleware(
-  compiler,
-  config.experiments.lazyCompilation,
-);
+const middleware = experiments.lazyCompilationMiddleware(compiler);
 
 const server = new DevServer(
   {
@@ -125,10 +122,9 @@ const server = new DevServer(
 server.start();
 ```
 
-`lazyCompilationMiddleware` 接受两个参数：
+`lazyCompilationMiddleware` 接受一个参数：
 
 - `compiler`: 当前的 [Compiler](/api/javascript-api/compiler) 实例
-- `options`: 懒编译的配置，与 [experiments.lazyCompilation](/config/experiments#experimentslazycompilation) 相同
 
 ## 自定义懒编译端点