fix(rsbuild): serve local dev server on port 4200

nrwl · Dec 18, 2024 · 23b6a60 · 23b6a60
1 parent b9a2a29
commit 23b6a60
Show file tree

Hide file tree

Showing 13 changed files with 64 additions and 4 deletions.
diff --git a/docs/generated/packages/rsbuild/generators/configuration.json b/docs/generated/packages/rsbuild/generators/configuration.json
@@ -26,6 +26,11 @@
         "description": "Path relative to the workspace root for the tsconfig file to build with. Defaults to '<projectRoot>/tsconfig.app.json'.",
         "x-priority": "important"
       },
+      "devServerPort": {
+        "type": "number",
+        "description": "The port for the dev server to listen on.",
+        "default": 4200
+      },
       "target": {
         "type": "string",
         "description": "Target platform for the build, same as the Rsbuild output.target config option.",

diff --git a/packages/react/src/generators/application/__snapshots__/application.spec.ts.snap b/packages/react/src/generators/application/__snapshots__/application.spec.ts.snap
@@ -50,6 +50,11 @@ export default defineConfig({
         },
         tsconfigPath: './tsconfig.app.json',
     },
+    dev: {
+        client: {
+            port: 4200
+        }
+    },
     output: {
 		copy: [
 		{ from: './src/favicon.ico' },
@@ -105,6 +110,11 @@ export default defineConfig({
         },
         tsconfigPath: './tsconfig.app.json',
     },
+    dev: {
+        client: {
+            port: 4200
+        }
+    },
     output: {
 		copy: [
 		{ from: './src/favicon.ico' },
@@ -164,6 +174,11 @@ export default defineConfig({
         },
         tsconfigPath: './tsconfig.app.json',
     },
+    dev: {
+        client: {
+            port: 4200
+        }
+    },
     output: {
 		copy: [
 		{ from: './src/favicon.ico' },

diff --git a/packages/react/src/generators/application/lib/add-e2e.ts b/packages/react/src/generators/application/lib/add-e2e.ts
@@ -84,7 +84,7 @@ export async function addE2e(
         `rsbuild.config.${options.js ? 'js' : 'ts'}`
       ),
       options.addPlugin,
-      options.devServerPort ?? 3000
+      options.devServerPort ?? 4200
     );
   }
 

diff --git a/packages/react/src/generators/application/lib/bundlers/add-rsbuild.ts b/packages/react/src/generators/application/lib/bundlers/add-rsbuild.ts
@@ -48,6 +48,7 @@ export async function setupRsbuildConfiguration(
     ),
     tsConfig: './tsconfig.app.json',
     target: 'web',
+    devServerPort: options.devServerPort ?? 4200,
   });
   tasks.push(rsbuildTask);
 

diff --git a/packages/rsbuild/src/generators/configuration/configuration.spec.ts b/packages/rsbuild/src/generators/configuration/configuration.spec.ts
@@ -61,6 +61,11 @@ describe('Rsbuild configuration generator', () => {
                   index: './src/index.ts'
               },
           },
+          dev: {
+              client: {
+                  port: 4200
+              }
+          },
           output: {
               target: 'web',
               distPath: {
@@ -94,6 +99,11 @@ describe('Rsbuild configuration generator', () => {
                   index: './src/main.ts'
               },
           },
+          dev: {
+              client: {
+                  port: 4200
+              }
+          },
           output: {
               target: 'web',
               distPath: {
@@ -127,6 +137,11 @@ describe('Rsbuild configuration generator', () => {
                   index: './src/main.ts'
               },
           },
+          dev: {
+              client: {
+                  port: 4200
+              }
+          },
           output: {
               target: 'web',
               distPath: {
@@ -157,6 +172,11 @@ describe('Rsbuild configuration generator', () => {
               },
               tsconfigPath: './tsconfig.json',
           },
+          dev: {
+              client: {
+                  port: 4200
+              }
+          },
           output: {
               target: 'web',
               distPath: {

diff --git a/packages/rsbuild/src/generators/configuration/files/rsbuild.config.ts__tpl__ b/packages/rsbuild/src/generators/configuration/files/rsbuild.config.ts__tpl__
@@ -7,6 +7,11 @@ export default defineConfig({
         },<% if (tsConfig) { %>
         tsconfigPath: '<%= tsConfig %>',<% } %>
     },
+    dev: {
+        client: {
+            port: <%= devServerPort %>
+        }
+    },
     output: {
         target: '<%= target %>',
         distPath: {

diff --git a/packages/rsbuild/src/generators/configuration/lib/normalize-options.ts b/packages/rsbuild/src/generators/configuration/lib/normalize-options.ts
@@ -9,6 +9,7 @@ import { relative } from 'path';
 export interface NormalizedOptions extends Schema {
   entry: string;
   target: 'node' | 'web' | 'web-worker';
+  devServerPort: number;
   tsConfig: string;
   projectRoot: string;
 }
@@ -30,6 +31,7 @@ export async function normalizeOptions(
       schema.tsConfig ?? './tsconfig.json',
       project.root
     ),
+    devServerPort: schema.devServerPort ?? 4200,
     projectRoot: project.root,
     skipFormat: schema.skipFormat ?? false,
     skipValidation: schema.skipValidation ?? false,

diff --git a/packages/rsbuild/src/generators/configuration/schema.d.ts b/packages/rsbuild/src/generators/configuration/schema.d.ts
@@ -2,6 +2,7 @@ export interface Schema {
   project: string;
   entry?: string;
   tsConfig?: string;
+  devServerPort?: number;
   target?: 'node' | 'web' | 'web-worker';
   skipValidation?: boolean;
   skipFormat?: boolean;

diff --git a/packages/rsbuild/src/generators/configuration/schema.json b/packages/rsbuild/src/generators/configuration/schema.json
@@ -26,6 +26,11 @@
       "description": "Path relative to the workspace root for the tsconfig file to build with. Defaults to '<projectRoot>/tsconfig.app.json'.",
       "x-priority": "important"
     },
+    "devServerPort": {
+      "type": "number",
+      "description": "The port for the dev server to listen on.",
+      "default": 4200
+    },
     "target": {
       "type": "string",
       "description": "Target platform for the build, same as the Rsbuild output.target config option.",

diff --git a/packages/rsbuild/src/utils/e2e-web-server-info-utils.ts b/packages/rsbuild/src/utils/e2e-web-server-info-utils.ts
@@ -9,7 +9,7 @@ export async function getRsbuildE2EWebServerInfo(
   e2ePortOverride?: number
 ) {
   const nxJson = readNxJson(tree);
-  let e2ePort = e2ePortOverride ?? 3000;
+  let e2ePort = e2ePortOverride ?? 4200;
 
   if (
     nxJson.targetDefaults?.['dev'] &&
@@ -31,7 +31,7 @@ export async function getRsbuildE2EWebServerInfo(
       defaultServeTargetName: 'dev',
       defaultServeStaticTargetName: 'preview',
       defaultE2EWebServerAddress: `http://localhost:${e2ePort}`,
-      defaultE2ECiBaseUrl: 'http://localhost:3000',
+      defaultE2ECiBaseUrl: 'http://localhost:4200',
       defaultE2EPort: e2ePort,
     },
     isPluginBeingAdded

diff --git a/packages/vue/src/generators/application/application.spec.ts b/packages/vue/src/generators/application/application.spec.ts
@@ -99,6 +99,11 @@ describe('application generator', () => {
           },
           tsconfigPath: './tsconfig.app.json',
         },
+        dev: {
+          client: {
+            port: 4200,
+          },
+        },
         output: {
           target: 'web',
           distPath: {

diff --git a/packages/vue/src/generators/application/lib/add-e2e.ts b/packages/vue/src/generators/application/lib/add-e2e.ts
@@ -58,7 +58,7 @@ export async function addE2e(
         `rsbuild.config.${options.js ? 'js' : 'ts'}`
       ),
       options.addPlugin,
-      options.devServerPort ?? 3000
+      options.devServerPort ?? 4200
     );
   }
 

diff --git a/packages/vue/src/generators/application/lib/add-rsbuild.ts b/packages/vue/src/generators/application/lib/add-rsbuild.ts
@@ -26,6 +26,7 @@ export async function addRsbuild(tree: Tree, options: NormalizedSchema) {
     entry: `./src/main.ts`,
     tsConfig: './tsconfig.app.json',
     target: 'web',
+    devServerPort: options.devServerPort ?? 4200,
   });
   tasks.push(rsbuildTask);