fix(@angular/build): disable dev-server websocket when live reload is disabled

packages/angular/build/src/builders/dev-server/options.ts

@@ -114,8 +114,8 @@ export async function normalizeOptions(
     open,
     verbose,
     watch,
-    liveReload,
-    hmr,
+    liveReload: !!liveReload,
+    hmr: hmr ?? !!liveReload,
     headers,
     workspaceRoot,
     projectRoot,

packages/angular/build/src/builders/dev-server/schema.json

@@ -67,8 +67,7 @@
     },
     "hmr": {
       "type": "boolean",
-      "description": "Enable hot module replacement.",
-      "default": false
+      "description": "Enable hot module replacement. Defaults to the value of 'liveReload'. Currently, only global and component stylesheets are supported."
     },
     "watch": {
       "type": "boolean",

packages/angular/build/src/builders/dev-server/vite-server.ts

@@ -137,8 +137,9 @@ export async function* serveWithVite(
     process.setSourceMapsEnabled(true);
   }
 
-  // Enable to support component style hot reloading (`NG_HMR_CSTYLES=0` can be used to disable)
-  browserOptions.externalRuntimeStyles = !!serverOptions.liveReload && useComponentStyleHmr;
+  // Enable to support component style hot reloading (`NG_HMR_CSTYLES=0` can be used to disable selectively)
+  browserOptions.externalRuntimeStyles =
+    serverOptions.liveReload && serverOptions.hmr && useComponentStyleHmr;
 
   // Enable to support component template hot replacement (`NG_HMR_TEMPLATE=1` can be used to enable)
   browserOptions.templateUpdates = !!serverOptions.liveReload && useComponentTemplateHmr;
@@ -465,7 +466,7 @@ async function handleUpdate(
     return;
   }
 
-  if (serverOptions.liveReload || serverOptions.hmr) {
+  if (serverOptions.hmr) {
     if (updatedFiles.every((f) => f.endsWith('.css'))) {
       const timestamp = Date.now();
       server.ws.send({
@@ -649,6 +650,8 @@ export async function setupServer(
       host: serverOptions.host,
       open: serverOptions.open,
       headers: serverOptions.headers,
+      // Disable the websocket if live reload is disabled (false/undefined are the only valid values)
+      ws: serverOptions.liveReload === false && serverOptions.hmr === false ? false : undefined,
       proxy,
       cors: {
         // Allow preflight requests to be proxied.
@@ -709,6 +712,7 @@ export async function setupServer(
         virtualProjectRoot,
         outputFiles,
         external: externalMetadata.explicitBrowser,
+        skipViteClient: serverOptions.liveReload === false && serverOptions.hmr === false,
       }),
     ],
     // Browser only optimizeDeps. (This does not run for SSR dependencies).

packages/angular/build/src/tools/vite/plugins/angular-memory-plugin.ts

@@ -17,6 +17,7 @@ interface AngularMemoryPluginOptions {
   virtualProjectRoot: string;
   outputFiles: AngularMemoryOutputFiles;
   external?: string[];
+  skipViteClient?: boolean;
 }
 
 export async function createAngularMemoryPlugin(
@@ -63,9 +64,11 @@ export async function createAngularMemoryPlugin(
       const relativeFile = '/' + normalizePath(relative(virtualProjectRoot, file));
       const codeContents = outputFiles.get(relativeFile)?.contents;
       if (codeContents === undefined) {
-        return relativeFile.endsWith('/node_modules/vite/dist/client/client.mjs')
-          ? loadViteClientCode(file)
-          : undefined;
+        if (relativeFile.endsWith('/node_modules/vite/dist/client/client.mjs')) {
+          return options.skipViteClient ? '' : loadViteClientCode(file);
+        }
+
+        return undefined;
       }
 
       const code = Buffer.from(codeContents).toString('utf-8');

packages/angular_devkit/build_angular/src/builders/dev-server/builder.ts

@@ -85,12 +85,15 @@ export function execute(
           );
         }
 
+        // New build system defaults hmr option to the value of liveReload
+        normalizedOptions.hmr ??= normalizedOptions.liveReload;
+
         return defer(() =>
           Promise.all([import('@angular/build/private'), import('../browser-esbuild')]),
         ).pipe(
           switchMap(([{ serveWithVite, buildApplicationInternal }, { convertBrowserOptions }]) =>
             serveWithVite(
-              normalizedOptions,
+              normalizedOptions as typeof normalizedOptions & { hmr: boolean },
               builderName,
               (options, context, codePlugins) => {
                 return builderName === '@angular-devkit/build-angular:browser-esbuild'
@@ -124,6 +127,9 @@ export function execute(
         );
       }
 
+      // Webpack based build systems default to false for hmr option
+      normalizedOptions.hmr ??= false;
+
       // Use Webpack for all other browser targets
       return defer(() => import('./webpack-server')).pipe(
         switchMap(({ serveWebpackBrowser }) =>

packages/angular_devkit/build_angular/src/builders/dev-server/options.ts

@@ -116,7 +116,7 @@ export async function normalizeOptions(
     open,
     verbose,
     watch,
-    liveReload,
+    liveReload: !!liveReload,
     hmr,
     headers,
     workspaceRoot,

packages/angular_devkit/build_angular/src/builders/dev-server/schema.json

@@ -84,8 +84,7 @@
     },
     "hmr": {
       "type": "boolean",
-      "description": "Enable hot module replacement.",
-      "default": false
+      "description": "Enable hot module replacement."
     },
     "watch": {
       "type": "boolean",