@angular/build 19.1.0-next.1 → 19.1.0-next.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular/build",
-  "version": "19.1.0-next.1",
+  "version": "19.1.0-next.2",
   "description": "Official build system for Angular",
   "keywords": [
     "Angular CLI",
@@ -23,7 +23,7 @@
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "2.3.0",
-    "@angular-devkit/architect": "0.1901.0-next.1",
+    "@angular-devkit/architect": "0.1901.0-next.2",
     "@babel/core": "7.26.0",
     "@babel/helper-annotate-as-pure": "7.25.9",
     "@babel/helper-split-export-declaration": "7.24.7",
@@ -43,7 +43,7 @@
     "picomatch": "4.0.2",
     "piscina": "4.8.0",
     "rollup": "4.28.1",
-    "sass": "1.82.0",
+    "sass": "1.83.0",
     "semver": "7.6.3",
     "vite": "6.0.3",
     "watchpack": "2.4.2"
@@ -57,7 +57,7 @@
     "@angular/localize": "^19.0.0 || ^19.1.0-next.0",
     "@angular/platform-server": "^19.0.0 || ^19.1.0-next.0",
     "@angular/service-worker": "^19.0.0 || ^19.1.0-next.0",
-    "@angular/ssr": "^19.1.0-next.1",
+    "@angular/ssr": "^19.1.0-next.2",
     "less": "^4.2.0",
     "postcss": "^8.4.0",
     "tailwindcss": "^2.0.0 || ^3.0.0",
@@ -86,7 +86,6 @@
       "optional": true
     }
   },
-  "packageManager": "yarn@4.5.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/angular/angular-cli.git"
@@ -109,5 +108,8 @@
     "puppeteer": {
       "built": true
     }
+  },
+  "pnpm": {
+    "onlyBuiltDependencies": []
   }
 }

package/src/builders/application/execute-build.js

@@ -6,6 +6,39 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.dev/license
  */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || (function () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __setModuleDefault(result, mod);
+        return result;
+    };
+})();
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.executeBuild = executeBuild;
 const source_file_cache_1 = require("../../tools/esbuild/angular/source-file-cache");
@@ -21,7 +54,6 @@ const environment_options_1 = require("../../utils/environment-options");
 const resolve_assets_1 = require("../../utils/resolve-assets");
 const manifest_1 = require("../../utils/server-rendering/manifest");
 const supported_browsers_1 = require("../../utils/supported-browsers");
-const chunk_optimizer_1 = require("./chunk-optimizer");
 const execute_post_bundle_1 = require("./execute-post-bundle");
 const i18n_1 = require("./i18n");
 const setup_bundling_1 = require("./setup-bundling");
@@ -85,7 +117,8 @@ async function executeBuild(options, context, rebuildState) {
         bundlingResult = bundler_context_1.BundlerContext.mergeResults([bundlingResult, ...componentResults]);
     }
     if (options.optimizationOptions.scripts && environment_options_1.shouldOptimizeChunks) {
-        bundlingResult = await (0, profiling_1.profileAsync)('OPTIMIZE_CHUNKS', () => (0, chunk_optimizer_1.optimizeChunks)(bundlingResult, options.sourcemapOptions.scripts ? !options.sourcemapOptions.hidden || 'hidden' : false));
+        const { optimizeChunks } = await Promise.resolve().then(() => __importStar(require('./chunk-optimizer')));
+        bundlingResult = await (0, profiling_1.profileAsync)('OPTIMIZE_CHUNKS', () => optimizeChunks(bundlingResult, options.sourcemapOptions.scripts ? !options.sourcemapOptions.hidden || 'hidden' : false));
     }
     const executionResult = new bundler_execution_result_1.ExecutionResult(bundlerContexts, componentStyleBundler, codeBundleCache, templateUpdates);
     executionResult.addWarnings(bundlingResult.warnings);

package/src/builders/dev-server/vite-server.js

@@ -103,14 +103,13 @@ async function* serveWithVite(serverOptions, builderName, builderAction, context
         // https://nodejs.org/api/process.html#processsetsourcemapsenabledval
         process.setSourceMapsEnabled(true);
     }
-    // Enable to support 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=0` can be used to disable selectively)
     browserOptions.externalRuntimeStyles =
         serverOptions.liveReload && serverOptions.hmr && environment_options_1.useComponentStyleHmr;
-    // Enable to support component template hot replacement (`NG_HMR_TEMPLATE=1` can be used to enable)
-    browserOptions.templateUpdates = !!serverOptions.liveReload && environment_options_1.useComponentTemplateHmr;
-    if (browserOptions.templateUpdates) {
-        context.logger.warn('Experimental support for component template hot replacement has been enabled via the "NG_HMR_TEMPLATE" environment variable.');
-    }
+    // Enable to support component template hot replacement (`NG_HMR_TEMPLATE=0` can be used to disable selectively)
+    // This will also replace file-based/inline styles as code if external runtime styles are not enabled.
+    browserOptions.templateUpdates =
+        serverOptions.liveReload && serverOptions.hmr && environment_options_1.useComponentTemplateHmr;
     // Setup the prebundling transformer that will be shared across Vite prebundling requests
     const prebundleTransformer = new internal_1.JavaScriptTransformer(
     // Always enable JIT linking to support applications built with and without AOT.
@@ -185,6 +184,10 @@ async function* serveWithVite(serverOptions, builderName, builderAction, context
                         assetFiles.set('/' + normalizePath(outputPath), normalizePath(file.inputPath));
                     }
                 }
+                // Invalidate SSR module graph to ensure that only new rebuild is used and not stale component updates
+                if (server && browserOptions.ssr && templateUpdates.size > 0) {
+                    server.moduleGraph.invalidateAll();
+                }
                 // Clear stale template updates on code rebuilds
                 templateUpdates.clear();
                 // Analyze result files for changes
@@ -197,6 +200,13 @@ async function* serveWithVite(serverOptions, builderName, builderAction, context
             case results_1.ResultKind.ComponentUpdate:
                 (0, node_assert_1.default)(serverOptions.hmr, 'Component updates are only supported with HMR enabled.');
                 (0, node_assert_1.default)(server, 'Builder must provide an initial full build before component update results.');
+                // Invalidate SSR module graph to ensure that new component updates are used
+                // TODO: Use fine-grained invalidation of only the component update modules
+                if (browserOptions.ssr) {
+                    server.moduleGraph.invalidateAll();
+                    const { ɵresetCompiledComponents } = (await server.ssrLoadModule('/main.server.mjs'));
+                    ɵresetCompiledComponents();
+                }
                 for (const componentUpdate of result.updates) {
                     if (componentUpdate.type === 'template') {
                         templateUpdates.set(componentUpdate.id, componentUpdate.content);
@@ -504,7 +514,14 @@ async function setupServer(serverOptions, outputFiles, assets, preserveSymlinks,
             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,
+            // When server-side rendering (SSR) is enabled togather with SSL and Express is being used,
+            // we must configure Vite to use HTTP/1.1.
+            // This is necessary because Express does not support HTTP/2.
+            // We achieve this by defining an empty proxy.
+            // See: https://github.com/vitejs/vite/blob/c4b532cc900bf988073583511f57bd581755d5e3/packages/vite/src/node/http.ts#L106
+            proxy: serverOptions.ssl && ssrMode === plugins_1.ServerSsrMode.ExternalSsrMiddleware
+                ? (proxy ?? {})
+                : proxy,
             cors: {
                 // Allow preflight requests to be proxied.
                 preflightContinue: true,

package/src/tools/esbuild/application-code-bundle.js

@@ -250,6 +250,8 @@ function createServerMainCodeBundleOptions(options, target, sourceFileCache, sty
               ɵextractRoutesAndCreateRouteTree,
               ɵgetOrCreateAngularServerApp,
             } from '@angular/ssr';`,
+                    // Need for HMR
+                    `export { ɵresetCompiledComponents } from '@angular/core';`,
                     // Re-export all symbols including default export from 'main.server.ts'
                     `export { default } from '${mainServerEntryPointJsImport}';`,
                     `export * from '${mainServerEntryPointJsImport}';`,

package/src/tools/vite/plugins/angular-memory-plugin.js

@@ -40,6 +40,17 @@ async function createAngularMemoryPlugin(options) {
                     const [importerFile] = importer.split('?', 1);
                     source = '/' + (0, node_path_1.join)((0, node_path_1.dirname)((0, node_path_1.relative)(virtualProjectRoot, importerFile)), source);
                 }
+                else if (!ssr &&
+                    source[0] === '/' &&
+                    importer.endsWith('index.html') &&
+                    normalizePath(importer).startsWith(virtualProjectRoot)) {
+                    // This is only needed when using SSR and `angularSsrMiddleware` (old style) to correctly resolve
+                    // .js files when using lazy-loading.
+                    // Remove query if present
+                    const [importerFile] = importer.split('?', 1);
+                    source =
+                        '/' + (0, node_path_1.join)((0, node_path_1.dirname)((0, node_path_1.relative)(virtualProjectRoot, importerFile)), (0, node_path_1.basename)(source));
+                }
             }
             const [file] = source.split('?', 1);
             if (outputFiles.has(file)) {
@@ -52,7 +63,7 @@ async function createAngularMemoryPlugin(options) {
                 // Extract component identifier (first character is rollup virtual module null)
                 const requestUrl = new URL(id.slice(1), 'http://localhost');
                 const componentId = requestUrl.searchParams.get('c');
-                return (componentId && options.templateUpdates?.get(componentId)) ?? '';
+                return (componentId && options.templateUpdates?.get(encodeURIComponent(componentId))) ?? '';
             }
             const [file] = id.split('?', 1);
             const relativeFile = '/' + normalizePath((0, node_path_1.relative)(virtualProjectRoot, file));

package/src/utils/environment-options.js

@@ -85,6 +85,6 @@ exports.shouldOptimizeChunks = isPresent(optimizeChunksVariable) && isEnabled(op
 const hmrComponentStylesVariable = process.env['NG_HMR_CSTYLES'];
 exports.useComponentStyleHmr = !isPresent(hmrComponentStylesVariable) || !isDisabled(hmrComponentStylesVariable);
 const hmrComponentTemplateVariable = process.env['NG_HMR_TEMPLATES'];
-exports.useComponentTemplateHmr = isPresent(hmrComponentTemplateVariable) && isEnabled(hmrComponentTemplateVariable);
+exports.useComponentTemplateHmr = !isPresent(hmrComponentTemplateVariable) || !isDisabled(hmrComponentTemplateVariable);
 const partialSsrBuildVariable = process.env['NG_BUILD_PARTIAL_SSR'];
 exports.usePartialSsrBuild = isPresent(partialSsrBuildVariable) && isEnabled(partialSsrBuildVariable);

package/src/utils/normalize-cache.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeCacheOptions = normalizeCacheOptions;
 const node_path_1 = require("node:path");
 /** Version placeholder is replaced during the build process with actual package version */
-const VERSION = '19.1.0-next.1';
+const VERSION = '19.1.0-next.2';
 function hasCacheMetadata(value) {
     return (!!value &&
         typeof value === 'object' &&

package/tsconfig-build.json

@@ -0,0 +1,6 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "types": ["node"]
+  }
+}