test(e2e): add more case for lazy compilation

.github/workflows/test.yml

@@ -23,7 +23,7 @@ jobs:
     timeout-minutes: 15
     strategy:
       matrix:
-        # run ut in macOS, as SWC cases will fail in Ubuntu CI
+        # run ut on macOS, as SWC cases will fail on Ubuntu CI
         os: [macos-14, windows-latest]
 
     steps:

e2e/cases/css/inject-styles/index.test.ts

@@ -47,7 +47,7 @@ rspackOnlyTest(
 rspackOnlyTest(
   'HMR should work well when `injectStyles` is enabled',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/lazy-compilation/add-initial-chunk/index.test.ts

@@ -1,21 +1,21 @@
 import { dev, rspackOnlyTest } from '@e2e/helper';
-import test, { expect } from '@playwright/test';
+import { expect, test } from '@playwright/test';
 
 // https://github.com/web-infra-dev/rspack/issues/6633
 rspackOnlyTest(
   'should render pages correctly when using lazy compilation and add new initial chunk',
   async ({ page }) => {
-    // TODO fix this case in Windows
+    // TODO fix this case on Windows
     if (process.platform === 'win32') {
       test.skip();
     }
+
     const rsbuild = await dev({
       cwd: __dirname,
       page,
     });
 
     await expect(page.locator('#test')).toHaveText('Hello World!');
-
     await rsbuild.close();
   },
 );

e2e/cases/lazy-compilation/basic/index.test.ts

@@ -1,24 +1,41 @@
-import { dev, gotoPage, rspackOnlyTest } from '@e2e/helper';
+import {
+  dev,
+  expectPoll,
+  gotoPage,
+  proxyConsole,
+  rspackOnlyTest,
+} from '@e2e/helper';
 import { expect, test } from '@playwright/test';
 
 rspackOnlyTest(
   'should render pages correctly when using lazy compilation',
   async ({ page }) => {
-    // TODO fix this case in Windows
+    // TODO fix this case on Windows
     if (process.platform === 'win32') {
       test.skip();
     }
 
+    const { logs, restore } = proxyConsole();
     const rsbuild = await dev({
       cwd: __dirname,
     });
 
     await gotoPage(page, rsbuild, 'page1');
     await expect(page.locator('#test')).toHaveText('Page 1');
+    await expectPoll(() =>
+      logs.some((log) => log.includes('building src/page1/index.js')),
+    ).toBeTruthy();
+    expect(
+      logs.some((log) => log.includes('building src/page2/index.js')),
+    ).toBeFalsy();
 
     await gotoPage(page, rsbuild, 'page2');
     await expect(page.locator('#test')).toHaveText('Page 2');
+    await expectPoll(() =>
+      logs.some((log) => log.includes('building src/page2/index.js')),
+    ).toBeTruthy();
 
     await rsbuild.close();
+    restore();
   },
 );

e2e/cases/lazy-compilation/dynamic-import/index.test.ts

@@ -0,0 +1,37 @@
+import {
+  dev,
+  expectPoll,
+  gotoPage,
+  proxyConsole,
+  rspackOnlyTest,
+} from '@e2e/helper';
+import { expect, test } from '@playwright/test';
+
+rspackOnlyTest(
+  'should lazy compile dynamic imported modules',
+  async ({ page }) => {
+    // TODO fix this case on Windows
+    if (process.platform === 'win32') {
+      test.skip();
+    }
+
+    const { logs, restore } = proxyConsole();
+    const rsbuild = await dev({
+      cwd: __dirname,
+      page,
+    });
+
+    await expectPoll(() =>
+      logs.some((log) => log.includes('building src/index.js')),
+    ).toBeTruthy();
+    expect(logs.some((log) => log.includes('building src/foo.js'))).toBeFalsy();
+
+    await gotoPage(page, rsbuild, 'index');
+    await expectPoll(() =>
+      logs.some((log) => log.includes('building src/foo.js')),
+    ).toBeTruthy();
+
+    await rsbuild.close();
+    restore();
+  },
+);

e2e/cases/lazy-compilation/dynamic-import/rsbuild.config.ts

@@ -0,0 +1,7 @@
+import { defineConfig } from '@rsbuild/core';
+
+export default defineConfig({
+  dev: {
+    lazyCompilation: true,
+  },
+});

e2e/cases/lazy-compilation/dynamic-import/src/foo.js

@@ -0,0 +1 @@
+export const foo = 'foo';

e2e/cases/lazy-compilation/dynamic-import/src/index.js

@@ -0,0 +1,5 @@
+console.log('entry');
+
+import('./foo').then(({ foo }) => {
+  console.log(foo);
+});

e2e/cases/live-reload/index.test.ts

@@ -18,7 +18,7 @@ test.afterEach(() => {
 test('should fallback to live-reload when dev.hmr is false', async ({
   page,
 }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/module-federation-v2/index.test.ts

@@ -29,7 +29,7 @@ export default Button;`,
 rspackOnlyTest(
   'should run module federation in development mode',
   async ({ page }) => {
-    // this case often timeout in Windows
+    // this case often timeout on Windows
     if (process.platform === 'win32') {
       test.skip();
     }
@@ -64,7 +64,7 @@ rspackOnlyTest(
 rspackOnlyTest(
   'should allow remote module to perform HMR',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/module-federation/index.test.ts

@@ -97,7 +97,7 @@ rspackOnlyTest(
 rspackOnlyTest(
   'should allow remote module to perform HMR',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/preact/prefresh-context/index.test.ts

@@ -5,7 +5,7 @@ import { expect, test } from '@playwright/test';
 
 // TODO: broken since preact 10.26.4
 test.skip('HMR should work properly with `createContext`', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/preact/prefresh-disabled/index.test.ts

@@ -4,7 +4,7 @@ import { dev, rspackOnlyTest } from '@e2e/helper';
 import { expect, test } from '@playwright/test';
 
 rspackOnlyTest('HMR should work properly', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/preact/prefresh/index.test.ts

@@ -4,7 +4,7 @@ import { dev, rspackOnlyTest } from '@e2e/helper';
 import { expect, test } from '@playwright/test';
 
 rspackOnlyTest('HMR should work properly', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/react/disable-fast-refresh/index.test.ts

@@ -8,7 +8,7 @@ const cwd = __dirname;
 rspackOnlyTest(
   'HMR should work when Fast Refresh is disabled',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/server/environments-hmr/index.test.ts

@@ -9,7 +9,7 @@ const cwd = __dirname;
 rspackOnlyTest(
   'Multiple environments HMR should work correctly',
   async ({ page, context }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/server/hmr/index.test.ts

@@ -6,7 +6,7 @@ import { expect, test } from '@playwright/test';
 const cwd = __dirname;
 
 rspackOnlyTest('HMR should work by default', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }
@@ -62,7 +62,7 @@ rspackOnlyTest('HMR should work by default', async ({ page }) => {
 rspackOnlyTest(
   'HMR should work when setting dev.port & client',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }
@@ -112,7 +112,7 @@ rspackOnlyTest(
 rspackOnlyTest(
   'HMR should work when dev.port is `<port>`',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/server/overlay/index.test.ts

@@ -6,7 +6,7 @@ import { expect, test } from '@playwright/test';
 const cwd = __dirname;
 
 test('should show overlay correctly', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/server/reload-html/index.test.ts

@@ -8,7 +8,7 @@ const cwd = __dirname;
 rspackOnlyTest(
   'should reload page when HTML template changed',
   async ({ page }) => {
-    // HMR cases will fail in Windows
+    // HMR cases will fail on Windows
     if (process.platform === 'win32') {
       test.skip();
     }

e2e/cases/server/setup-middlewares/index.test.ts

@@ -4,7 +4,7 @@ import { expect, test } from '@playwright/test';
 test('should apply custom middleware via `setupMiddlewares`', async ({
   page,
 }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/solid/hmr/index.test.ts

@@ -4,7 +4,7 @@ import { dev, rspackOnlyTest } from '@e2e/helper';
 import { expect, test } from '@playwright/test';
 
 rspackOnlyTest('HMR should work properly', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/svelte/hmr/index.test.ts

@@ -5,7 +5,7 @@ import { expect, test } from '@playwright/test';
 import { pluginSvelte } from '@rsbuild/plugin-svelte';
 
 rspackOnlyTest('HMR should work properly', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/cases/tailwindcss/hmr/index.test.ts

@@ -9,7 +9,7 @@ const getContent = (
 `;
 
 rspackOnlyTest('should support tailwindcss HMR', async ({ page }) => {
-  // HMR cases will fail in Windows
+  // HMR cases will fail on Windows
   if (process.platform === 'win32') {
     test.skip();
   }

e2e/scripts/shared.ts

@@ -82,7 +82,7 @@ function isPortAvailable(port: number) {
 const portMap = new Map();
 
 // Available port ranges: 1024 ～ 65535
-// `10080` is not available in macOS CI, `> 50000` get 'permission denied' in Windows.
+// `10080` is not available on macOS CI, `> 50000` get 'permission denied' on Windows.
 // so we use `15000` ~ `45000`.
 export async function getRandomPort(
   defaultPort = Math.ceil(Math.random() * 30000) + 15000,

packages/core/src/plugins/output.ts

@@ -40,7 +40,7 @@ function getPublicPath({
     if (hostname === DEFAULT_DEV_HOST) {
       const localHostname = 'localhost';
       // If user not specify the hostname, it would use 0.0.0.0
-      // The http://0.0.0.0:port can't visit in Windows, so we shouldn't set publicPath as `//0.0.0.0:${port}/`;
+      // The http://0.0.0.0:port can't visit on Windows, so we shouldn't set publicPath as `//0.0.0.0:${port}/`;
       // Relative to docs:
       // - https://github.com/quarkusio/quarkus/issues/12246
       publicPath = `${protocol}://${localHostname}:<port>/`;

website/docs/en/config/dev/lazy-compilation.mdx

@@ -33,7 +33,7 @@ Although Rspack itself has good performance, the overall build time can still be
 Lazy compilation is an effective strategy to improve the startup performance of the development phase. Instead of compiling all modules at initialization, it compiles modules on demand as they're needed. This means that developers can quickly see the application running when starting the dev server, and build the required modules in batches. By compiling on demand, unnecessary compilation time can be reduced. As the project scales up, compilation time does not significantly increase, which greatly enhances the development experience.
 
 :::tip
-Lazy compilation only takes effect during development and has no impact on production builds.
+Lazy compilation is only effective for dev builds and does not affect production builds.
 :::
 
 ## Example

website/docs/en/config/source/include.mdx

@@ -70,7 +70,7 @@ export default {
 The above two methods match the absolute paths of files using "path prefixes" and "regular expressions" respectively. It is worth noting that all referenced modules in the project will be matched. Therefore, you should avoid using overly loose values for matching to prevent compilation performance issues or compilation errors.
 
 :::tip
-In the regular expression example, we use `[\\/]` to match the path separator because different operating systems use different path separators. Using `[\\/]` ensures that the paths can be matched in macOS, Linux and Windows.
+In the regular expression example, we use `[\\/]` to match the path separator because different operating systems use different path separators. Using `[\\/]` ensures that the paths can be matched on macOS, Linux and Windows.
 :::
 
 ## Compile sub dependencies