@angular-devkit/build-angular 14.0.0-next.10 → 14.0.0-next.13

package/builders.json

@@ -11,6 +11,11 @@
       "schema": "./src/builders/browser/schema.json",
       "description": "Build a browser application."
     },
+    "browser-esbuild": {
+      "implementation": "./src/builders/browser-esbuild",
+      "schema": "./src/builders/browser/schema.json",
+      "description": "Build a browser application."
+    },
     "dev-server": {
       "implementation": "./src/builders/dev-server",
       "schema": "./src/builders/dev-server/schema.json",

package/package.json

@@ -1,15 +1,15 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "14.0.0-next.10",
+  "version": "14.0.0-next.13",
   "description": "Angular Webpack Build Facade",
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
-    "@ampproject/remapping": "2.1.2",
-    "@angular-devkit/architect": "0.1400.0-next.10",
-    "@angular-devkit/build-webpack": "0.1400.0-next.10",
-    "@angular-devkit/core": "14.0.0-next.10",
+    "@ampproject/remapping": "2.2.0",
+    "@angular-devkit/architect": "0.1400.0-next.13",
+    "@angular-devkit/build-webpack": "0.1400.0-next.13",
+    "@angular-devkit/core": "14.0.0-next.13",
     "@babel/core": "7.17.9",
     "@babel/generator": "7.17.9",
     "@babel/helper-annotate-as-pure": "7.16.7",
@@ -20,19 +20,19 @@
     "@babel/runtime": "7.17.9",
     "@babel/template": "7.16.7",
     "@discoveryjs/json-ext": "0.5.7",
-    "@ngtools/webpack": "14.0.0-next.10",
+    "@ngtools/webpack": "14.0.0-next.13",
     "ansi-colors": "4.1.1",
-    "babel-loader": "8.2.4",
+    "babel-loader": "8.2.5",
     "babel-plugin-istanbul": "6.1.1",
     "browserslist": "^4.9.1",
-    "cacache": "16.0.4",
+    "cacache": "16.0.7",
     "copy-webpack-plugin": "10.2.4",
     "critters": "0.0.16",
     "css-loader": "6.7.1",
-    "esbuild-wasm": "0.14.36",
+    "esbuild-wasm": "0.14.38",
     "glob": "8.0.1",
     "https-proxy-agent": "5.0.1",
-    "inquirer": "8.2.2",
+    "inquirer": "8.2.4",
     "jsonc-parser": "3.0.0",
     "karma-source-map-support": "1.4.0",
     "less": "4.1.2",
@@ -48,21 +48,21 @@
     "postcss": "8.4.12",
     "postcss-import": "14.1.0",
     "postcss-loader": "6.2.1",
-    "postcss-preset-env": "7.4.3",
+    "postcss-preset-env": "7.4.4",
     "regenerator-runtime": "0.13.9",
     "resolve-url-loader": "5.0.0",
     "rxjs": "6.6.7",
-    "sass": "1.50.1",
+    "sass": "1.51.0",
     "sass-loader": "12.6.0",
     "semver": "7.3.7",
     "source-map-loader": "3.0.1",
     "source-map-support": "0.5.21",
     "stylus": "0.57.0",
     "stylus-loader": "6.2.0",
-    "terser": "5.12.1",
+    "terser": "5.13.0",
     "text-table": "0.2.0",
     "tree-kill": "1.2.2",
-    "tslib": "2.3.1",
+    "tslib": "2.4.0",
     "webpack": "5.72.0",
     "webpack-dev-middleware": "5.3.1",
     "webpack-dev-server": "4.8.1",
@@ -70,7 +70,7 @@
     "webpack-subresource-integrity": "5.1.0"
   },
   "optionalDependencies": {
-    "esbuild": "0.14.36"
+    "esbuild": "0.14.38"
   },
   "peerDependencies": {
     "@angular/compiler-cli": "^14.0.0 || ^14.0.0-next",

package/src/babel/webpack-loader.d.ts

@@ -14,5 +14,6 @@ interface AngularCustomOptions extends Omit<ApplicationPresetOptions, 'instrumen
     };
 }
 export declare type AngularBabelLoaderOptions = AngularCustomOptions & Record<string, unknown>;
+export declare function requiresLinking(path: string, source: string): Promise<boolean>;
 declare const _default: any;
 export default _default;

package/src/babel/webpack-loader.js

@@ -7,6 +7,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.requiresLinking = void 0;
 const babel_loader_1 = require("babel-loader");
 const typescript_1 = require("typescript");
 const load_esm_1 = require("../utils/load-esm");
@@ -38,6 +39,7 @@ async function requiresLinking(path, source) {
     }
     return needsLinking(path, source);
 }
+exports.requiresLinking = requiresLinking;
 // eslint-disable-next-line max-lines-per-function
 exports.default = (0, babel_loader_1.custom)(() => {
     const baseOptions = Object.freeze({

package/src/builders/app-shell/index.js

@@ -95,7 +95,7 @@ async function _renderUniversal(options, context, browserResult, serverResult, s
         }
         await fs.promises.writeFile(outputIndexPath, html);
         if (browserOptions.serviceWorker) {
-            await (0, service_worker_1.augmentAppWithServiceWorker)(projectRoot, outputPath, browserOptions.baseHref || '/', browserOptions.ngswConfigPath);
+            await (0, service_worker_1.augmentAppWithServiceWorker)(projectRoot, root, outputPath, browserOptions.baseHref || '/', browserOptions.ngswConfigPath);
         }
     }
     return browserResult;

package/src/builders/browser/index.js

@@ -252,7 +252,7 @@ function buildWebpackBrowser(options, context, transforms = {}) {
                         spinner.start('Generating service worker...');
                         for (const [locale, outputPath] of outputPaths.entries()) {
                             try {
-                                await (0, service_worker_1.augmentAppWithServiceWorker)(projectRoot, outputPath, getLocaleBaseHref(i18n, locale) || options.baseHref || '/', options.ngswConfigPath);
+                                await (0, service_worker_1.augmentAppWithServiceWorker)(projectRoot, context.workspaceRoot, outputPath, getLocaleBaseHref(i18n, locale) || options.baseHref || '/', options.ngswConfigPath);
                             }
                             catch (error) {
                                 spinner.fail('Service worker generation failed.');

package/src/builders/browser-esbuild/compiler-plugin.d.ts

@@ -0,0 +1,14 @@
+/**
+ * @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.io/license
+ */
+import type { Plugin } from 'esbuild';
+import { BundleStylesheetOptions } from './stylesheets';
+export declare function createCompilerPlugin(pluginOptions: {
+    sourcemap: boolean;
+    tsconfig: string;
+    advancedOptimizations?: boolean;
+}, styleOptions: BundleStylesheetOptions): Plugin;

package/src/builders/browser-esbuild/compiler-plugin.js

@@ -0,0 +1,338 @@
+"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.io/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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createCompilerPlugin = void 0;
+const core_1 = require("@babel/core");
+const assert = __importStar(require("assert"));
+const fs_1 = require("fs");
+const path = __importStar(require("path"));
+const typescript_1 = __importDefault(require("typescript"));
+const application_1 = __importDefault(require("../../babel/presets/application"));
+const webpack_loader_1 = require("../../babel/webpack-loader");
+const load_esm_1 = require("../../utils/load-esm");
+const stylesheets_1 = require("./stylesheets");
+/**
+ * Converts TypeScript Diagnostic related information into an esbuild compatible note object.
+ * Related information is a subset of a full TypeScript Diagnostic and also used for diagnostic
+ * notes associated with the main Diagnostic.
+ * @param diagnostic The TypeScript diagnostic relative information to convert.
+ * @param host A TypeScript FormatDiagnosticsHost instance to use during conversion.
+ * @returns An esbuild diagnostic message as a PartialMessage object
+ */
+function convertTypeScriptDiagnosticInfo(info, host, textPrefix) {
+    let text = typescript_1.default.flattenDiagnosticMessageText(info.messageText, host.getNewLine());
+    if (textPrefix) {
+        text = textPrefix + text;
+    }
+    const note = { text };
+    if (info.file) {
+        note.location = {
+            file: info.file.fileName,
+            length: info.length,
+        };
+        // Calculate the line/column location and extract the full line text that has the diagnostic
+        if (info.start) {
+            const { line, character } = typescript_1.default.getLineAndCharacterOfPosition(info.file, info.start);
+            note.location.line = line + 1;
+            note.location.column = character;
+            // The start position for the slice is the first character of the error line
+            const lineStartPosition = typescript_1.default.getPositionOfLineAndCharacter(info.file, line, 0);
+            // The end position for the slice is the first character of the next line or the length of
+            // the entire file if the line is the last line of the file (getPositionOfLineAndCharacter
+            // will error if a nonexistent line is passed).
+            const { line: lastLineOfFile } = typescript_1.default.getLineAndCharacterOfPosition(info.file, info.file.text.length - 1);
+            const lineEndPosition = line < lastLineOfFile
+                ? typescript_1.default.getPositionOfLineAndCharacter(info.file, line + 1, 0)
+                : info.file.text.length;
+            note.location.lineText = info.file.text.slice(lineStartPosition, lineEndPosition).trimEnd();
+        }
+    }
+    return note;
+}
+/**
+ * Converts a TypeScript Diagnostic message into an esbuild compatible message object.
+ * @param diagnostic The TypeScript diagnostic to convert.
+ * @param host A TypeScript FormatDiagnosticsHost instance to use during conversion.
+ * @returns An esbuild diagnostic message as a PartialMessage object
+ */
+function convertTypeScriptDiagnostic(diagnostic, host) {
+    var _a;
+    let codePrefix = 'TS';
+    let code = `${diagnostic.code}`;
+    if (diagnostic.source === 'ngtsc') {
+        codePrefix = 'NG';
+        // Remove `-99` Angular prefix from diagnostic code
+        code = code.slice(3);
+    }
+    const message = {
+        ...convertTypeScriptDiagnosticInfo(diagnostic, host, `${codePrefix}${code}: `),
+        // Store original diagnostic for reference if needed downstream
+        detail: diagnostic,
+    };
+    if ((_a = diagnostic.relatedInformation) === null || _a === void 0 ? void 0 : _a.length) {
+        message.notes = diagnostic.relatedInformation.map((info) => convertTypeScriptDiagnosticInfo(info, host));
+    }
+    return message;
+}
+// This is a non-watch version of the compiler code from `@ngtools/webpack` augmented for esbuild
+// eslint-disable-next-line max-lines-per-function
+function createCompilerPlugin(pluginOptions, styleOptions) {
+    return {
+        name: 'angular-compiler',
+        // eslint-disable-next-line max-lines-per-function
+        async setup(build) {
+            var _a;
+            var _b;
+            // This uses a wrapped dynamic import to load `@angular/compiler-cli` which is ESM.
+            // Once TypeScript provides support for retaining dynamic imports this workaround can be dropped.
+            const compilerCli = await (0, load_esm_1.loadEsmModule)('@angular/compiler-cli');
+            // Temporary deep import for transformer support
+            const { createAotTransformers, mergeTransformers, } = require('@ngtools/webpack/src/ivy/transformation');
+            // Setup defines based on the values provided by the Angular compiler-cli
+            (_a = (_b = build.initialOptions).define) !== null && _a !== void 0 ? _a : (_b.define = {});
+            for (const [key, value] of Object.entries(compilerCli.GLOBAL_DEFS_FOR_TERSER_WITH_AOT)) {
+                if (key in build.initialOptions.define) {
+                    // Skip keys that have been manually provided
+                    continue;
+                }
+                // esbuild requires values to be a string (actual strings need to be quoted).
+                // In this case, all provided values are booleans.
+                build.initialOptions.define[key] = value.toString();
+            }
+            // The tsconfig is loaded in setup instead of in start to allow the esbuild target build option to be modified.
+            // esbuild build options can only be modified in setup prior to starting the build.
+            const { options: compilerOptions, rootNames, errors: configurationDiagnostics, } = compilerCli.readConfiguration(pluginOptions.tsconfig, {
+                enableIvy: true,
+                noEmitOnError: false,
+                suppressOutputPathCheck: true,
+                outDir: undefined,
+                inlineSources: pluginOptions.sourcemap,
+                inlineSourceMap: pluginOptions.sourcemap,
+                sourceMap: false,
+                mapRoot: undefined,
+                sourceRoot: undefined,
+                declaration: false,
+                declarationMap: false,
+                allowEmptyCodegenFiles: false,
+                annotationsAs: 'decorators',
+                enableResourceInlining: false,
+            });
+            // Adjust the esbuild output target based on the tsconfig target
+            if (compilerOptions.target === undefined ||
+                compilerOptions.target <= typescript_1.default.ScriptTarget.ES2015) {
+                build.initialOptions.target = 'es2015';
+            }
+            else if (compilerOptions.target >= typescript_1.default.ScriptTarget.ESNext) {
+                build.initialOptions.target = 'esnext';
+            }
+            else {
+                build.initialOptions.target = typescript_1.default.ScriptTarget[compilerOptions.target].toLowerCase();
+            }
+            // The file emitter created during `onStart` that will be used during the build in `onLoad` callbacks for TS files
+            let fileEmitter;
+            build.onStart(async () => {
+                var _a, _b;
+                const result = {};
+                // Create TypeScript compiler host
+                const host = typescript_1.default.createIncrementalCompilerHost(compilerOptions);
+                // Temporarily add a readResource hook to allow for a transformResource hook.
+                // Once the AOT compiler allows only a transformResource hook this can be removed.
+                host.readResource = function (fileName) {
+                    var _a;
+                    // Provide same no file found behavior as @ngtools/webpack
+                    return (_a = this.readFile(fileName)) !== null && _a !== void 0 ? _a : '';
+                };
+                // Add an AOT compiler resource transform hook
+                host.transformResource = async function (data, context) {
+                    var _a, _b, _c;
+                    // Only style resources are transformed currently
+                    if (context.type !== 'style') {
+                        return null;
+                    }
+                    // The file with the resource content will either be an actual file (resourceFile)
+                    // or the file containing the inline component style text (containingFile).
+                    const file = (_a = context.resourceFile) !== null && _a !== void 0 ? _a : context.containingFile;
+                    const { contents, errors, warnings } = await (0, stylesheets_1.bundleStylesheetText)(data, {
+                        resolvePath: path.dirname(file),
+                        virtualName: file,
+                    }, styleOptions);
+                    ((_b = result.errors) !== null && _b !== void 0 ? _b : (result.errors = [])).push(...errors);
+                    ((_c = result.warnings) !== null && _c !== void 0 ? _c : (result.warnings = [])).push(...warnings);
+                    return { content: contents };
+                };
+                // Create the Angular specific program that contains the Angular compiler
+                const angularProgram = new compilerCli.NgtscProgram(rootNames, compilerOptions, host);
+                const angularCompiler = angularProgram.compiler;
+                const { ignoreForDiagnostics, ignoreForEmit } = angularCompiler;
+                const typeScriptProgram = angularProgram.getTsProgram();
+                const builder = typescript_1.default.createAbstractBuilder(typeScriptProgram, host);
+                await angularCompiler.analyzeAsync();
+                function* collectDiagnostics() {
+                    // Collect program level diagnostics
+                    yield* configurationDiagnostics;
+                    yield* angularCompiler.getOptionDiagnostics();
+                    yield* builder.getOptionsDiagnostics();
+                    yield* builder.getGlobalDiagnostics();
+                    // Collect source file specific diagnostics
+                    const OptimizeFor = compilerCli.OptimizeFor;
+                    for (const sourceFile of builder.getSourceFiles()) {
+                        if (ignoreForDiagnostics.has(sourceFile)) {
+                            continue;
+                        }
+                        yield* builder.getSyntacticDiagnostics(sourceFile);
+                        yield* builder.getSemanticDiagnostics(sourceFile);
+                        const angularDiagnostics = angularCompiler.getDiagnosticsForFile(sourceFile, OptimizeFor.WholeProgram);
+                        yield* angularDiagnostics;
+                    }
+                }
+                for (const diagnostic of collectDiagnostics()) {
+                    const message = convertTypeScriptDiagnostic(diagnostic, host);
+                    if (diagnostic.category === typescript_1.default.DiagnosticCategory.Error) {
+                        ((_a = result.errors) !== null && _a !== void 0 ? _a : (result.errors = [])).push(message);
+                    }
+                    else {
+                        ((_b = result.warnings) !== null && _b !== void 0 ? _b : (result.warnings = [])).push(message);
+                    }
+                }
+                fileEmitter = createFileEmitter(builder, mergeTransformers(angularCompiler.prepareEmit().transformers, createAotTransformers(builder, {})), () => []);
+                return result;
+            });
+            build.onLoad({ filter: compilerOptions.allowJs ? /\.[cm]?[jt]sx?$/ : /\.[cm]?tsx?$/ }, async (args) => {
+                var _a, _b;
+                assert.ok(fileEmitter, 'Invalid plugin execution order');
+                const typescriptResult = await fileEmitter(args.path);
+                if (!typescriptResult) {
+                    // No TS result indicates the file is not part of the TypeScript program.
+                    // If allowJs is enabled and the file is JS then defer to the next load hook.
+                    if (compilerOptions.allowJs && /\.[cm]?js$/.test(args.path)) {
+                        return undefined;
+                    }
+                    // Otherwise return an error
+                    return {
+                        errors: [
+                            {
+                                text: 'File is missing from the TypeScript compilation.',
+                                location: { file: args.path },
+                                notes: [
+                                    {
+                                        text: `Ensure the file is part of the TypeScript program via the 'files' or 'include' property.`,
+                                    },
+                                ],
+                            },
+                        ],
+                    };
+                }
+                const data = (_a = typescriptResult.content) !== null && _a !== void 0 ? _a : '';
+                const babelResult = await (0, core_1.transformAsync)(data, {
+                    filename: args.path,
+                    inputSourceMap: (pluginOptions.sourcemap ? undefined : false),
+                    sourceMaps: pluginOptions.sourcemap ? 'inline' : false,
+                    compact: false,
+                    configFile: false,
+                    babelrc: false,
+                    browserslistConfigFile: false,
+                    plugins: [],
+                    presets: [
+                        [
+                            application_1.default,
+                            {
+                                forceAsyncTransformation: data.includes('async'),
+                                optimize: pluginOptions.advancedOptimizations && {},
+                            },
+                        ],
+                    ],
+                });
+                return {
+                    contents: (_b = babelResult === null || babelResult === void 0 ? void 0 : babelResult.code) !== null && _b !== void 0 ? _b : '',
+                    loader: 'js',
+                };
+            });
+            build.onLoad({ filter: /\.[cm]?js$/ }, async (args) => {
+                var _a;
+                const angularPackage = /[\\/]node_modules[\\/]@angular[\\/]/.test(args.path);
+                const linkerPluginCreator = (await (0, load_esm_1.loadEsmModule)('@angular/compiler-cli/linker/babel')).createEs2015LinkerPlugin;
+                const data = await fs_1.promises.readFile(args.path, 'utf-8');
+                const result = await (0, core_1.transformAsync)(data, {
+                    filename: args.path,
+                    inputSourceMap: (pluginOptions.sourcemap ? undefined : false),
+                    sourceMaps: pluginOptions.sourcemap ? 'inline' : false,
+                    compact: false,
+                    configFile: false,
+                    babelrc: false,
+                    browserslistConfigFile: false,
+                    plugins: [],
+                    presets: [
+                        [
+                            application_1.default,
+                            {
+                                angularLinker: {
+                                    shouldLink: await (0, webpack_loader_1.requiresLinking)(args.path, data),
+                                    jitMode: false,
+                                    linkerPluginCreator,
+                                },
+                                forceAsyncTransformation: !/[\\/][_f]?esm2015[\\/]/.test(args.path) && data.includes('async'),
+                                optimize: pluginOptions.advancedOptimizations && {
+                                    looseEnums: angularPackage,
+                                    pureTopLevel: angularPackage,
+                                },
+                            },
+                        ],
+                    ],
+                });
+                return {
+                    contents: (_a = result === null || result === void 0 ? void 0 : result.code) !== null && _a !== void 0 ? _a : data,
+                    loader: 'js',
+                };
+            });
+        },
+    };
+}
+exports.createCompilerPlugin = createCompilerPlugin;
+function createFileEmitter(program, transformers = {}, onAfterEmit) {
+    return async (file) => {
+        const sourceFile = program.getSourceFile(file);
+        if (!sourceFile) {
+            return undefined;
+        }
+        let content;
+        program.emit(sourceFile, (filename, data) => {
+            if (/\.[cm]?js$/.test(filename)) {
+                content = data;
+            }
+        }, undefined /* cancellationToken */, undefined /* emitOnlyDtsFiles */, transformers);
+        onAfterEmit === null || onAfterEmit === void 0 ? void 0 : onAfterEmit(sourceFile);
+        return { content, dependencies: [] };
+    };
+}

package/src/builders/browser-esbuild/esbuild.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @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.io/license
+ */
+import { BuilderContext } from '@angular-devkit/architect';
+import { BuildFailure, BuildOptions, BuildResult, Message, OutputFile } from 'esbuild';
+/**
+ * Determines if an unknown value is an esbuild BuildFailure error object thrown by esbuild.
+ * @param value A potential esbuild BuildFailure error object.
+ * @returns `true` if the object is determined to be a BuildFailure object; otherwise, `false`.
+ */
+export declare function isEsBuildFailure(value: unknown): value is BuildFailure;
+/**
+ * Executes the esbuild build function and normalizes the build result in the event of a
+ * build failure that results in no output being generated.
+ * All builds use the `write` option with a value of `false` to allow for the output files
+ * build result array to be populated.
+ *
+ * @param options The esbuild options object to use when building.
+ * @returns If output files are generated, the full esbuild BuildResult; if not, the
+ * warnings and errors for the attempted build.
+ */
+export declare function bundle(options: BuildOptions): Promise<(BuildResult & {
+    outputFiles: OutputFile[];
+}) | (BuildFailure & {
+    outputFiles?: never;
+})>;
+export declare function logMessages(context: BuilderContext, { errors, warnings }: {
+    errors: Message[];
+    warnings: Message[];
+}): Promise<void>;

package/src/builders/browser-esbuild/esbuild.js

@@ -0,0 +1,59 @@
+"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.io/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.logMessages = exports.bundle = exports.isEsBuildFailure = void 0;
+const esbuild_1 = require("esbuild");
+/**
+ * Determines if an unknown value is an esbuild BuildFailure error object thrown by esbuild.
+ * @param value A potential esbuild BuildFailure error object.
+ * @returns `true` if the object is determined to be a BuildFailure object; otherwise, `false`.
+ */
+function isEsBuildFailure(value) {
+    return !!value && typeof value === 'object' && 'errors' in value && 'warnings' in value;
+}
+exports.isEsBuildFailure = isEsBuildFailure;
+/**
+ * Executes the esbuild build function and normalizes the build result in the event of a
+ * build failure that results in no output being generated.
+ * All builds use the `write` option with a value of `false` to allow for the output files
+ * build result array to be populated.
+ *
+ * @param options The esbuild options object to use when building.
+ * @returns If output files are generated, the full esbuild BuildResult; if not, the
+ * warnings and errors for the attempted build.
+ */
+async function bundle(options) {
+    try {
+        return await (0, esbuild_1.build)({
+            ...options,
+            write: false,
+        });
+    }
+    catch (failure) {
+        // Build failures will throw an exception which contains errors/warnings
+        if (isEsBuildFailure(failure)) {
+            return failure;
+        }
+        else {
+            throw failure;
+        }
+    }
+}
+exports.bundle = bundle;
+async function logMessages(context, { errors, warnings }) {
+    if (warnings.length) {
+        const warningMessages = await (0, esbuild_1.formatMessages)(warnings, { kind: 'warning', color: true });
+        context.logger.warn(warningMessages.join('\n'));
+    }
+    if (errors.length) {
+        const errorMessages = await (0, esbuild_1.formatMessages)(errors, { kind: 'error', color: true });
+        context.logger.error(errorMessages.join('\n'));
+    }
+}
+exports.logMessages = logMessages;

package/src/builders/browser-esbuild/experimental-warnings.d.ts

@@ -0,0 +1,10 @@
+/**
+ * @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.io/license
+ */
+import { BuilderContext } from '@angular-devkit/architect';
+import { Schema as BrowserBuilderOptions } from '../browser/schema';
+export declare function logExperimentalWarnings(options: BrowserBuilderOptions, context: BuilderContext): void;

package/src/builders/browser-esbuild/experimental-warnings.js

@@ -0,0 +1,65 @@
+"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.io/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.logExperimentalWarnings = void 0;
+const UNSUPPORTED_OPTIONS = [
+    'allowedCommonJsDependencies',
+    'budgets',
+    'extractLicenses',
+    'fileReplacements',
+    'progress',
+    'scripts',
+    'statsJson',
+    // * i18n support
+    'localize',
+    // The following two have no effect when localize is not enabled
+    // 'i18nDuplicateTranslation',
+    // 'i18nMissingTranslation',
+    // * Serviceworker support
+    'ngswConfigPath',
+    'serviceWorker',
+    // * Stylesheet preprocessor support
+    'inlineStyleLanguage',
+    // The following option has no effect until preprocessors are supported
+    // 'stylePreprocessorOptions',
+    // * Watch mode
+    'watch',
+    'poll',
+    // * Deprecated
+    'deployUrl',
+    // * Always enabled with esbuild
+    // 'commonChunk',
+    // * Currently unsupported by esbuild
+    'namedChunks',
+    'vendorChunk',
+    'webWorkerTsConfig',
+];
+function logExperimentalWarnings(options, context) {
+    // Warn about experimental status of this builder
+    context.logger.warn(`The esbuild browser application builder ('browser-esbuild') is currently experimental.`);
+    // Validate supported options
+    // Currently only a subset of the Webpack-based browser builder options are supported.
+    for (const unsupportedOption of UNSUPPORTED_OPTIONS) {
+        const value = options[unsupportedOption];
+        if (value === undefined || value === false) {
+            continue;
+        }
+        if (Array.isArray(value) && value.length === 0) {
+            continue;
+        }
+        if (typeof value === 'object' && Object.keys(value).length === 0) {
+            continue;
+        }
+        if (unsupportedOption === 'inlineStyleLanguage' && value === 'css') {
+            continue;
+        }
+        context.logger.warn(`The '${unsupportedOption}' option is currently unsupported by this experimental builder and will be ignored.`);
+    }
+}
+exports.logExperimentalWarnings = logExperimentalWarnings;

package/src/builders/browser-esbuild/index.d.ts

@@ -0,0 +1,19 @@
+/**
+ * @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.io/license
+ */
+import { BuilderContext, BuilderOutput } from '@angular-devkit/architect';
+import { Schema as BrowserBuilderOptions } from '../browser/schema';
+/**
+ * Main execution function for the esbuild-based application builder.
+ * The options are compatible with the Webpack-based builder.
+ * @param options The browser builder options to use when setting up the application build
+ * @param context The Architect builder context object
+ * @returns A promise with the builder result output
+ */
+export declare function execute(options: BrowserBuilderOptions, context: BuilderContext): Promise<BuilderOutput>;
+declare const _default: import("@angular-devkit/architect/src/internal").Builder<BrowserBuilderOptions & import("../../../../core/src").JsonObject>;
+export default _default;

package/src/builders/browser-esbuild/index.js

@@ -0,0 +1,258 @@
+"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.io/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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.execute = void 0;
+const architect_1 = require("@angular-devkit/architect");
+const assert = __importStar(require("assert"));
+const fs_1 = require("fs");
+const path = __importStar(require("path"));
+const utils_1 = require("../../utils");
+const copy_assets_1 = require("../../utils/copy-assets");
+const index_html_generator_1 = require("../../utils/index-file/index-html-generator");
+const package_chunk_sort_1 = require("../../utils/package-chunk-sort");
+const webpack_browser_config_1 = require("../../utils/webpack-browser-config");
+const configs_1 = require("../../webpack/configs");
+const compiler_plugin_1 = require("./compiler-plugin");
+const esbuild_1 = require("./esbuild");
+const experimental_warnings_1 = require("./experimental-warnings");
+const options_1 = require("./options");
+const stylesheets_1 = require("./stylesheets");
+/**
+ * Main execution function for the esbuild-based application builder.
+ * The options are compatible with the Webpack-based builder.
+ * @param options The browser builder options to use when setting up the application build
+ * @param context The Architect builder context object
+ * @returns A promise with the builder result output
+ */
+// eslint-disable-next-line max-lines-per-function
+async function execute(options, context) {
+    var _a, _b, _c, _d, _e, _f;
+    const startTime = Date.now();
+    // Only AOT is currently supported
+    if (options.aot !== true) {
+        context.logger.error('JIT mode is currently not supported by this experimental builder. AOT mode must be used.');
+        return { success: false };
+    }
+    // Inform user of experimental status of builder and options
+    (0, experimental_warnings_1.logExperimentalWarnings)(options, context);
+    // Determine project name from builder context target
+    const projectName = (_a = context.target) === null || _a === void 0 ? void 0 : _a.project;
+    if (!projectName) {
+        context.logger.error(`The 'browser-esbuild' builder requires a target to be specified.`);
+        return { success: false };
+    }
+    const { workspaceRoot, mainEntryPoint, polyfillsEntryPoint, optimizationOptions, outputPath, sourcemapOptions, tsconfig, assets, outputNames, } = await (0, options_1.normalizeOptions)(context, projectName, options);
+    // Clean output path if enabled
+    if (options.deleteOutputPath) {
+        (0, utils_1.deleteOutputDir)(workspaceRoot, options.outputPath);
+    }
+    // Setup bundler entry points
+    const entryPoints = {
+        main: mainEntryPoint,
+    };
+    if (polyfillsEntryPoint) {
+        entryPoints['polyfills'] = polyfillsEntryPoint;
+    }
+    // Create reverse lookup used during index HTML generation
+    const entryPointNameLookup = new Map(Object.entries(entryPoints).map(([name, filePath]) => [path.relative(workspaceRoot, filePath), name]));
+    // Execute esbuild
+    const result = await bundleCode(workspaceRoot, entryPoints, outputNames, options, optimizationOptions, sourcemapOptions, tsconfig);
+    // Log all warnings and errors generated during bundling
+    await (0, esbuild_1.logMessages)(context, result);
+    // Return if the bundling failed to generate output files or there are errors
+    if (!result.outputFiles || result.errors.length) {
+        return { success: false };
+    }
+    // Structure the bundling output files
+    const initialFiles = [];
+    const outputFiles = [];
+    for (const outputFile of result.outputFiles) {
+        // Entries in the metafile are relative to the `absWorkingDir` option which is set to the workspaceRoot
+        const relativeFilePath = path.relative(workspaceRoot, outputFile.path);
+        const entryPoint = (_c = (_b = result.metafile) === null || _b === void 0 ? void 0 : _b.outputs[relativeFilePath]) === null || _c === void 0 ? void 0 : _c.entryPoint;
+        if (entryPoint) {
+            // An entryPoint value indicates an initial file
+            initialFiles.push({
+                // Remove leading directory separator
+                file: outputFile.path.slice(1),
+                name: (_d = entryPointNameLookup.get(entryPoint)) !== null && _d !== void 0 ? _d : '',
+                extension: path.extname(outputFile.path),
+            });
+        }
+        outputFiles.push(outputFile);
+    }
+    // Create output directory if needed
+    try {
+        await fs_1.promises.mkdir(outputPath, { recursive: true });
+    }
+    catch (e) {
+        const reason = 'message' in e ? e.message : 'Unknown error';
+        context.logger.error('Unable to create output directory: ' + reason);
+        return { success: false };
+    }
+    // Process global stylesheets
+    if (options.styles) {
+        // resolveGlobalStyles is temporarily reused from the Webpack builder code
+        const { entryPoints: stylesheetEntrypoints, noInjectNames } = (0, configs_1.resolveGlobalStyles)(options.styles, workspaceRoot, !!options.preserveSymlinks);
+        for (const [name, files] of Object.entries(stylesheetEntrypoints)) {
+            const virtualEntryData = files.map((file) => `@import '${file}';`).join('\n');
+            const sheetResult = await (0, stylesheets_1.bundleStylesheetText)(virtualEntryData, { virtualName: `angular:style/global;${name}`, resolvePath: workspaceRoot }, {
+                optimization: !!optimizationOptions.styles.minify,
+                sourcemap: !!sourcemapOptions.styles,
+                outputNames: noInjectNames.includes(name) ? { media: outputNames.media } : outputNames,
+            });
+            await (0, esbuild_1.logMessages)(context, sheetResult);
+            if (!sheetResult.path) {
+                // Failed to process the stylesheet
+                assert.ok(sheetResult.errors.length, `Global stylesheet processing for '${name}' failed with no errors.`);
+                return { success: false };
+            }
+            // The virtual stylesheets will be named `stdin` by esbuild. This must be replaced
+            // with the actual name of the global style and the leading directory separator must
+            // also be removed to make the path relative.
+            const sheetPath = sheetResult.path.replace('stdin', name).slice(1);
+            outputFiles.push(createOutputFileFromText(sheetPath, sheetResult.contents));
+            if (sheetResult.map) {
+                outputFiles.push(createOutputFileFromText(sheetPath + '.map', sheetResult.map));
+            }
+            if (!noInjectNames.includes(name)) {
+                initialFiles.push({
+                    file: sheetPath,
+                    name,
+                    extension: '.css',
+                });
+            }
+            outputFiles.push(...sheetResult.resourceFiles);
+        }
+    }
+    // Generate index HTML file
+    if (options.index) {
+        const entrypoints = (0, package_chunk_sort_1.generateEntryPoints)({
+            scripts: (_e = options.scripts) !== null && _e !== void 0 ? _e : [],
+            styles: (_f = options.styles) !== null && _f !== void 0 ? _f : [],
+        });
+        // Create an index HTML generator that reads from the in-memory output files
+        const indexHtmlGenerator = new index_html_generator_1.IndexHtmlGenerator({
+            indexPath: path.join(context.workspaceRoot, (0, webpack_browser_config_1.getIndexInputFile)(options.index)),
+            entrypoints,
+            sri: options.subresourceIntegrity,
+            optimization: optimizationOptions,
+            crossOrigin: options.crossOrigin,
+        });
+        indexHtmlGenerator.readAsset = async function (path) {
+            // Remove leading directory separator
+            path = path.slice(1);
+            const file = outputFiles.find((file) => file.path === path);
+            if (file) {
+                return file.text;
+            }
+            throw new Error(`Output file does not exist: ${path}`);
+        };
+        const { content, warnings, errors } = await indexHtmlGenerator.process({
+            baseHref: options.baseHref,
+            lang: undefined,
+            outputPath: '/',
+            files: initialFiles,
+        });
+        for (const error of errors) {
+            context.logger.error(error);
+        }
+        for (const warning of warnings) {
+            context.logger.warn(warning);
+        }
+        outputFiles.push(createOutputFileFromText((0, webpack_browser_config_1.getIndexOutputFile)(options.index), content));
+    }
+    // Copy assets
+    if (assets) {
+        await (0, copy_assets_1.copyAssets)(assets, [outputPath], workspaceRoot);
+    }
+    // Write output files
+    await Promise.all(outputFiles.map((file) => fs_1.promises.writeFile(path.join(outputPath, file.path), file.contents)));
+    context.logger.info(`Complete. [${(Date.now() - startTime) / 1000} seconds]`);
+    return { success: true };
+}
+exports.execute = execute;
+function createOutputFileFromText(path, text) {
+    return {
+        path,
+        text,
+        get contents() {
+            return Buffer.from(this.text, 'utf-8');
+        },
+    };
+}
+async function bundleCode(workspaceRoot, entryPoints, outputNames, options, optimizationOptions, sourcemapOptions, tsconfig) {
+    return (0, esbuild_1.bundle)({
+        absWorkingDir: workspaceRoot,
+        bundle: true,
+        format: 'esm',
+        entryPoints,
+        entryNames: outputNames.bundles,
+        assetNames: outputNames.media,
+        target: 'es2020',
+        mainFields: ['es2020', 'browser', 'module', 'main'],
+        conditions: ['es2020', 'module'],
+        resolveExtensions: ['.ts', '.tsx', '.mjs', '.js'],
+        logLevel: options.verbose ? 'debug' : 'silent',
+        metafile: true,
+        minify: optimizationOptions.scripts,
+        pure: ['forwardRef'],
+        outdir: '/',
+        sourcemap: sourcemapOptions.scripts && (sourcemapOptions.hidden ? 'external' : true),
+        splitting: true,
+        tsconfig,
+        write: false,
+        platform: 'browser',
+        preserveSymlinks: options.preserveSymlinks,
+        plugins: [
+            (0, compiler_plugin_1.createCompilerPlugin)(
+            // JS/TS options
+            {
+                sourcemap: !!sourcemapOptions.scripts,
+                tsconfig,
+                advancedOptimizations: options.buildOptimizer,
+            }, 
+            // Component stylesheet options
+            {
+                workspaceRoot,
+                optimization: !!optimizationOptions.styles.minify,
+                sourcemap: !!sourcemapOptions.styles,
+                outputNames,
+            }),
+        ],
+        define: {
+            'ngDevMode': optimizationOptions.scripts ? 'false' : 'true',
+            'ngJitMode': 'false',
+        },
+    });
+}
+exports.default = (0, architect_1.createBuilder)(execute);

package/src/builders/browser-esbuild/options.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @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.io/license
+ */
+import { BuilderContext } from '@angular-devkit/architect';
+import { Schema as BrowserBuilderOptions } from '../browser/schema';
+/**
+ * Normalize the user provided options by creating full paths for all path based options
+ * and converting multi-form options into a single form that can be directly used
+ * by the build process.
+ *
+ * @param context The context for current builder execution.
+ * @param projectName The name of the project for the current execution.
+ * @param options An object containing the options to use for the build.
+ * @returns An object containing normalized options required to perform the build.
+ */
+export declare function normalizeOptions(context: BuilderContext, projectName: string, options: BrowserBuilderOptions): Promise<{
+    workspaceRoot: string;
+    mainEntryPoint: string;
+    polyfillsEntryPoint: string | undefined;
+    optimizationOptions: import("../../utils").NormalizedOptimizationOptions;
+    outputPath: string;
+    sourcemapOptions: import("../browser/schema").SourceMapClass;
+    tsconfig: string;
+    projectRoot: string;
+    assets: import("../browser/schema").AssetPatternClass[] | undefined;
+    outputNames: {
+        bundles: string;
+        media: string;
+    };
+}>;

package/src/builders/browser-esbuild/options.js

@@ -0,0 +1,87 @@
+"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.io/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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.normalizeOptions = void 0;
+const path = __importStar(require("path"));
+const utils_1 = require("../../utils");
+const schema_1 = require("../browser/schema");
+/**
+ * Normalize the user provided options by creating full paths for all path based options
+ * and converting multi-form options into a single form that can be directly used
+ * by the build process.
+ *
+ * @param context The context for current builder execution.
+ * @param projectName The name of the project for the current execution.
+ * @param options An object containing the options to use for the build.
+ * @returns An object containing normalized options required to perform the build.
+ */
+async function normalizeOptions(context, projectName, options) {
+    var _a, _b, _c, _d;
+    const workspaceRoot = context.workspaceRoot;
+    const projectMetadata = await context.getProjectMetadata(projectName);
+    const projectRoot = path.join(workspaceRoot, (_a = projectMetadata.root) !== null && _a !== void 0 ? _a : '');
+    const projectSourceRoot = path.join(workspaceRoot, (_b = projectMetadata.sourceRoot) !== null && _b !== void 0 ? _b : 'src');
+    // Normalize options
+    const mainEntryPoint = path.join(workspaceRoot, options.main);
+    const polyfillsEntryPoint = options.polyfills && path.join(workspaceRoot, options.polyfills);
+    const tsconfig = path.join(workspaceRoot, options.tsConfig);
+    const outputPath = path.join(workspaceRoot, options.outputPath);
+    const optimizationOptions = (0, utils_1.normalizeOptimization)(options.optimization);
+    const sourcemapOptions = (0, utils_1.normalizeSourceMaps)((_c = options.sourceMap) !== null && _c !== void 0 ? _c : false);
+    const assets = ((_d = options.assets) === null || _d === void 0 ? void 0 : _d.length)
+        ? (0, utils_1.normalizeAssetPatterns)(options.assets, workspaceRoot, projectRoot, projectSourceRoot)
+        : undefined;
+    const outputNames = {
+        bundles: options.outputHashing === schema_1.OutputHashing.All || options.outputHashing === schema_1.OutputHashing.Bundles
+            ? '[name].[hash]'
+            : '[name]',
+        media: options.outputHashing === schema_1.OutputHashing.All || options.outputHashing === schema_1.OutputHashing.Media
+            ? '[name].[hash]'
+            : '[name]',
+    };
+    if (options.resourcesOutputPath) {
+        outputNames.media = path.join(options.resourcesOutputPath, outputNames.media);
+    }
+    return {
+        workspaceRoot,
+        mainEntryPoint,
+        polyfillsEntryPoint,
+        optimizationOptions,
+        outputPath,
+        sourcemapOptions,
+        tsconfig,
+        projectRoot,
+        assets,
+        outputNames,
+    };
+}
+exports.normalizeOptions = normalizeOptions;

package/src/builders/browser-esbuild/stylesheets.d.ts

@@ -0,0 +1,52 @@
+/**
+ * @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.io/license
+ */
+import type { OutputFile } from 'esbuild';
+export interface BundleStylesheetOptions {
+    workspaceRoot?: string;
+    optimization: boolean;
+    preserveSymlinks?: boolean;
+    sourcemap: boolean | 'external';
+    outputNames?: {
+        bundles?: string;
+        media?: string;
+    };
+}
+/**
+ * Bundle a stylesheet that exists as a file on the filesystem.
+ *
+ * @param filename The path to the file to bundle.
+ * @param options The stylesheet bundling options to use.
+ * @returns The bundle result object.
+ */
+export declare function bundleStylesheetFile(filename: string, options: BundleStylesheetOptions): Promise<{
+    errors: import("esbuild").Message[];
+    warnings: import("esbuild").Message[];
+    contents: string;
+    map: string | undefined;
+    path: string | undefined;
+    resourceFiles: OutputFile[];
+}>;
+/**
+ * Bundle stylesheet text data from a string.
+ *
+ * @param data The string content of a stylesheet to bundle.
+ * @param dataOptions The options to use to resolve references and name output of the stylesheet data.
+ * @param bundleOptions  The stylesheet bundling options to use.
+ * @returns The bundle result object.
+ */
+export declare function bundleStylesheetText(data: string, dataOptions: {
+    resolvePath: string;
+    virtualName?: string;
+}, bundleOptions: BundleStylesheetOptions): Promise<{
+    errors: import("esbuild").Message[];
+    warnings: import("esbuild").Message[];
+    contents: string;
+    map: string | undefined;
+    path: string | undefined;
+    resourceFiles: OutputFile[];
+}>;

package/src/builders/browser-esbuild/stylesheets.js

@@ -0,0 +1,118 @@
+"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.io/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 (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.bundleStylesheetText = exports.bundleStylesheetFile = void 0;
+const path = __importStar(require("path"));
+const esbuild_1 = require("./esbuild");
+async function bundleStylesheet(entry, options) {
+    var _a, _b;
+    // Execute esbuild
+    const result = await (0, esbuild_1.bundle)({
+        ...entry,
+        absWorkingDir: options.workspaceRoot,
+        bundle: true,
+        entryNames: (_a = options.outputNames) === null || _a === void 0 ? void 0 : _a.bundles,
+        assetNames: (_b = options.outputNames) === null || _b === void 0 ? void 0 : _b.media,
+        logLevel: 'silent',
+        minify: options.optimization,
+        sourcemap: options.sourcemap,
+        outdir: '/',
+        write: false,
+        platform: 'browser',
+        preserveSymlinks: options.preserveSymlinks,
+        conditions: ['style'],
+        mainFields: ['style'],
+        plugins: [
+        // TODO: preprocessor plugins
+        ],
+    });
+    // Extract the result of the bundling from the output files
+    let contents = '';
+    let map;
+    let outputPath;
+    const resourceFiles = [];
+    if (result.outputFiles) {
+        for (const outputFile of result.outputFiles) {
+            const filename = path.basename(outputFile.path);
+            if (filename.endsWith('.css')) {
+                outputPath = outputFile.path;
+                contents = outputFile.text;
+            }
+            else if (filename.endsWith('.css.map')) {
+                map = outputFile.text;
+            }
+            else {
+                // The output files could also contain resources (images/fonts/etc.) that were referenced
+                resourceFiles.push(outputFile);
+            }
+        }
+    }
+    return {
+        errors: result.errors,
+        warnings: result.warnings,
+        contents,
+        map,
+        path: outputPath,
+        resourceFiles,
+    };
+}
+/**
+ * Bundle a stylesheet that exists as a file on the filesystem.
+ *
+ * @param filename The path to the file to bundle.
+ * @param options The stylesheet bundling options to use.
+ * @returns The bundle result object.
+ */
+async function bundleStylesheetFile(filename, options) {
+    return bundleStylesheet({ entryPoints: [filename] }, options);
+}
+exports.bundleStylesheetFile = bundleStylesheetFile;
+/**
+ * Bundle stylesheet text data from a string.
+ *
+ * @param data The string content of a stylesheet to bundle.
+ * @param dataOptions The options to use to resolve references and name output of the stylesheet data.
+ * @param bundleOptions  The stylesheet bundling options to use.
+ * @returns The bundle result object.
+ */
+async function bundleStylesheetText(data, dataOptions, bundleOptions) {
+    const result = bundleStylesheet({
+        stdin: {
+            contents: data,
+            sourcefile: dataOptions.virtualName,
+            resolveDir: dataOptions.resolvePath,
+            loader: 'css',
+        },
+    }, bundleOptions);
+    return result;
+}
+exports.bundleStylesheetText = bundleStylesheetText;

package/src/utils/service-worker.d.ts

@@ -5,4 +5,4 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
-export declare function augmentAppWithServiceWorker(appRoot: string, outputPath: string, baseHref: string, ngswConfigPath?: string): Promise<void>;
+export declare function augmentAppWithServiceWorker(appRoot: string, workspaceRoot: string, outputPath: string, baseHref: string, ngswConfigPath?: string): Promise<void>;

package/src/utils/service-worker.js

@@ -75,10 +75,10 @@ class CliFilesystem {
         return items;
     }
 }
-async function augmentAppWithServiceWorker(appRoot, outputPath, baseHref, ngswConfigPath) {
+async function augmentAppWithServiceWorker(appRoot, workspaceRoot, outputPath, baseHref, ngswConfigPath) {
     // Determine the configuration file path
     const configPath = ngswConfigPath
-        ? path.normalize(ngswConfigPath)
+        ? path.join(workspaceRoot, ngswConfigPath)
         : path.join(appRoot, 'ngsw-config.json');
     // Read the configuration file
     let config;

package/src/webpack/configs/styles.d.ts

@@ -6,5 +6,11 @@
  * found in the LICENSE file at https://angular.io/license
  */
 import { Configuration } from 'webpack';
+import { StyleElement } from '../../builders/browser/schema';
 import { WebpackConfigOptions } from '../../utils/build-options';
+export declare function resolveGlobalStyles(styleEntrypoints: StyleElement[], root: string, preserveSymlinks: boolean): {
+    entryPoints: Record<string, string[]>;
+    noInjectNames: string[];
+    paths: string[];
+};
 export declare function getStylesConfig(wco: WebpackConfigOptions): Configuration;

package/src/webpack/configs/styles.js

@@ -33,7 +33,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getStylesConfig = void 0;
+exports.getStylesConfig = exports.resolveGlobalStyles = void 0;
 const fs = __importStar(require("fs"));
 const mini_css_extract_plugin_1 = __importDefault(require("mini-css-extract-plugin"));
 const path = __importStar(require("path"));
@@ -75,6 +75,7 @@ function resolveGlobalStyles(styleEntrypoints, root, preserveSymlinks) {
     }
     return { entryPoints, noInjectNames, paths };
 }
+exports.resolveGlobalStyles = resolveGlobalStyles;
 // eslint-disable-next-line max-lines-per-function
 function getStylesConfig(wco) {
     var _a, _b, _c;