fix(@angular/build): use component updates for component style HMR

The newly stable template HMR support has also been improved to support hot
replacement of component stylesheets. While this is not as fast during a rebuild
as external stylesheet based HMR, it does currently avoid some edge cases with
the current implementation. Once these cases are resolved, the default may
be reverted to the previous setup.

If the previous behavior is preferred, the `NG_HMR_CSTYLES=1` environment
variable can be used.

Author: clydin

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

@@ -138,7 +138,7 @@ export async function* serveWithVite(
     process.setSourceMapsEnabled(true);
   }
 
-  // Enable to support link-based component style hot reloading (`NG_HMR_CSTYLES=0` can be used to disable selectively)
+  // Enable to support link-based component style hot reloading (`NG_HMR_CSTYLES=1` can be used to enable)
   browserOptions.externalRuntimeStyles =
     serverOptions.liveReload && serverOptions.hmr && useComponentStyleHmr;
 

packages/angular/build/src/utils/environment-options.ts

@@ -103,7 +103,7 @@ export const shouldOptimizeChunks =
 
 const hmrComponentStylesVariable = process.env['NG_HMR_CSTYLES'];
 export const useComponentStyleHmr =
-  !isPresent(hmrComponentStylesVariable) || !isDisabled(hmrComponentStylesVariable);
+  isPresent(hmrComponentStylesVariable) && isEnabled(hmrComponentStylesVariable);
 
 const hmrComponentTemplateVariable = process.env['NG_HMR_TEMPLATES'];
 export const useComponentTemplateHmr =