@angular/build 18.1.0 → 18.1.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@angular/build",
-  "version": "18.1.0",
+  "version": "18.1.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.1801.0",
+    "@angular-devkit/architect": "0.1801.2",
     "@babel/core": "7.24.7",
     "@babel/helper-annotate-as-pure": "7.24.7",
     "@babel/helper-split-export-declaration": "7.24.7",

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

@@ -42,6 +42,7 @@ const node_module_1 = require("node:module");
 const node_path_1 = require("node:path");
 const angular_memory_plugin_1 = require("../../tools/vite/angular-memory-plugin");
 const i18n_locale_plugin_1 = require("../../tools/vite/i18n-locale-plugin");
+const id_prefix_plugin_1 = require("../../tools/vite/id-prefix-plugin");
 const utils_1 = require("../../utils");
 const load_esm_1 = require("../../utils/load-esm");
 const internal_1 = require("./internal");
@@ -441,6 +442,7 @@ async function setupServer(serverOptions, outputFiles, assets, preserveSymlinks,
                 extensionMiddleware,
                 normalizePath,
             }),
+            (0, id_prefix_plugin_1.createRemoveIdPrefixPlugin)(externalMetadata.explicit),
         ],
         // Browser only optimizeDeps. (This does not run for SSR dependencies).
         optimizeDeps: getDepOptimizationConfig({

package/src/tools/esbuild/budget-stats.js

@@ -45,7 +45,10 @@ function generateBudgetStats(metafile, outputFiles, initialFiles) {
     }
     // Add component styles from metafile
     // TODO: Provide this information directly from the AOT compiler
-    for (const entry of Object.values(metafile.outputs)) {
+    for (const [file, entry] of Object.entries(metafile.outputs)) {
+        if (!file.endsWith('.css')) {
+            continue;
+        }
         // 'ng-component' is set by the angular plugin's component stylesheet bundler
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         const componentStyle = entry['ng-component'];

package/src/tools/esbuild/wasm-plugin.js

@@ -35,7 +35,7 @@ function createWasmPlugin(options) {
     return {
         name: 'angular-wasm',
         setup(build) {
-            build.onResolve({ filter: /.wasm$/ }, async (args) => {
+            build.onResolve({ filter: /\.wasm$/ }, async (args) => {
                 // Skip if already resolving the WASM file to avoid infinite resolution
                 if (args.pluginData?.[WASM_RESOLVE_SYMBOL]) {
                     return;
@@ -75,7 +75,7 @@ function createWasmPlugin(options) {
                     namespace: WASM_INIT_NAMESPACE,
                 };
             });
-            build.onLoad({ filter: /.wasm$/, namespace: WASM_INIT_NAMESPACE }, (0, load_result_cache_1.createCachedLoad)(cache, async (args) => {
+            build.onLoad({ filter: /\.wasm$/, namespace: WASM_INIT_NAMESPACE }, (0, load_result_cache_1.createCachedLoad)(cache, async (args) => {
                 // Ensure async mode is supported
                 if (!allowAsync) {
                     return {
@@ -155,7 +155,7 @@ function createWasmPlugin(options) {
                     watchFiles: [args.path],
                 };
             }));
-            build.onLoad({ filter: /.wasm$/, namespace: WASM_CONTENTS_NAMESPACE }, async (args) => {
+            build.onLoad({ filter: /\.wasm$/, namespace: WASM_CONTENTS_NAMESPACE }, async (args) => {
                 const contents = args.pluginData.wasmContents ?? (await (0, promises_1.readFile)(args.path));
                 let loader = 'file';
                 if (args.with.loader) {

package/src/tools/sass/lexer.js

@@ -50,7 +50,7 @@ function* findUrls(contents) {
         if (pos > 0) {
             pos -= 2;
             next();
-            if (!isWhitespace(current) && current !== 0x0027 && current !== 0x003a) {
+            if (!isWhitespace(current) && current !== 0x002c && current !== 0x003a) {
                 // Skip - not a url token
                 pos += 3;
                 continue;

package/src/tools/vite/id-prefix-plugin.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * 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
+ */
+import type { Plugin } from 'vite';
+export declare const createRemoveIdPrefixPlugin: (externals: string[]) => Plugin;

package/src/tools/vite/id-prefix-plugin.js

@@ -0,0 +1,44 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * 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
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRemoveIdPrefixPlugin = void 0;
+// NOTE: the implementation for this Vite plugin is roughly based on:
+// https://github.com/MilanKovacic/vite-plugin-externalize-dependencies
+const VITE_ID_PREFIX = '@id/';
+const escapeRegexSpecialChars = (inputString) => {
+    return inputString.replace(/[.*+?^${}()|[\]\\]/g, '\\$&'); // $& means the whole matched string
+};
+const createRemoveIdPrefixPlugin = (externals) => ({
+    name: 'vite-plugin-remove-id-prefix',
+    apply: 'serve',
+    configResolved: (resolvedConfig) => {
+        // don't do anything when the list of externals is empty
+        if (externals.length === 0) {
+            return;
+        }
+        const escapedExternals = externals.map(escapeRegexSpecialChars);
+        const prefixedExternalRegex = new RegExp(`${resolvedConfig.base}${VITE_ID_PREFIX}(${escapedExternals.join('|')})`, 'g');
+        // @ts-expect-error: Property 'push' does not exist on type 'readonly Plugin<any>[]'
+        // Reasoning:
+        //  since the /@id/ prefix is added by Vite's import-analysis plugin,
+        //  we must add our actual plugin dynamically, to ensure that it will run
+        //  AFTER the import-analysis.
+        resolvedConfig.plugins.push({
+            name: 'vite-plugin-remove-id-prefix-transform',
+            transform: (code) => {
+                // don't do anything when code does not contain the Vite prefix
+                if (!code.includes(VITE_ID_PREFIX)) {
+                    return code;
+                }
+                return code.replace(prefixedExternalRegex, (_, externalName) => externalName);
+            },
+        });
+    },
+});
+exports.createRemoveIdPrefixPlugin = createRemoveIdPrefixPlugin;

package/src/tools/vite/middlewares/assets-middleware.js

@@ -69,7 +69,8 @@ function createAngularAssetsMiddleware(server, assets, outputFiles) {
         if (!pathnameHasTrailingSlash) {
             for (const assetPath of assets.keys()) {
                 if (pathname === assetPath.substring(0, assetPath.lastIndexOf('/'))) {
-                    const location = req.url + '/';
+                    const { pathname, search, hash } = new URL(req.url, 'http://localhost');
+                    const location = [pathname, '/', search, hash].join('');
                     res.statusCode = 301;
                     res.setHeader('Content-Type', 'text/html');
                     res.setHeader('Location', location);

package/src/tools/vite/middlewares/index-html-middleware.js

@@ -8,6 +8,7 @@
  */
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createAngularIndexHtmlMiddleware = createAngularIndexHtmlMiddleware;
+const node_path_1 = require("node:path");
 const utils_1 = require("../utils");
 function createAngularIndexHtmlMiddleware(server, outputFiles, indexHtmlTransformer) {
     return function (req, res, next) {
@@ -18,11 +19,12 @@ function createAngularIndexHtmlMiddleware(server, outputFiles, indexHtmlTransfor
         // Parse the incoming request.
         // The base of the URL is unused but required to parse the URL.
         const pathname = (0, utils_1.pathnameWithoutBasePath)(req.url, server.config.base);
-        if (pathname !== '/' && pathname !== '/index.html') {
+        const extension = (0, node_path_1.extname)(pathname);
+        if (extension !== '.html') {
             next();
             return;
         }
-        const rawHtml = outputFiles.get('/index.html')?.contents;
+        const rawHtml = outputFiles.get(pathname)?.contents;
         if (!rawHtml) {
             next();
             return;

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 = '18.1.0';
+const VERSION = '18.1.2';
 function hasCacheMetadata(value) {
     return (!!value &&
         typeof value === 'object' &&