@angular-devkit/build-angular 13.0.0-next.6 → 13.0.0-next.7

package/src/utils/normalize-builder-schema.js

@@ -13,12 +13,12 @@ const normalize_file_replacements_1 = require("./normalize-file-replacements");
 const normalize_optimization_1 = require("./normalize-optimization");
 const normalize_source_maps_1 = require("./normalize-source-maps");
 function normalizeBrowserSchema(root, projectRoot, sourceRoot, options) {
-    const normalizedSourceMapOptions = normalize_source_maps_1.normalizeSourceMaps(options.sourceMap || false);
+    const normalizedSourceMapOptions = (0, normalize_source_maps_1.normalizeSourceMaps)(options.sourceMap || false);
     return {
         ...options,
-        assets: normalize_asset_patterns_1.normalizeAssetPatterns(options.assets || [], root, projectRoot, sourceRoot),
-        fileReplacements: normalize_file_replacements_1.normalizeFileReplacements(options.fileReplacements || [], root),
-        optimization: normalize_optimization_1.normalizeOptimization(options.optimization),
+        assets: (0, normalize_asset_patterns_1.normalizeAssetPatterns)(options.assets || [], root, projectRoot, sourceRoot),
+        fileReplacements: (0, normalize_file_replacements_1.normalizeFileReplacements)(options.fileReplacements || [], root),
+        optimization: (0, normalize_optimization_1.normalizeOptimization)(options.optimization),
         sourceMap: normalizedSourceMapOptions,
         preserveSymlinks: options.preserveSymlinks === undefined
             ? process.execArgv.includes('--preserve-symlinks')

package/src/utils/normalize-file-replacements.js

@@ -22,11 +22,11 @@ function normalizeFileReplacements(fileReplacements, root) {
     }
     const normalizedReplacement = fileReplacements.map((replacement) => normalizeFileReplacement(replacement, root));
     for (const { replace, with: replacementWith } of normalizedReplacement) {
-        if (!fs_1.existsSync(core_1.getSystemPath(replacementWith))) {
-            throw new MissingFileReplacementException(core_1.getSystemPath(replacementWith));
+        if (!(0, fs_1.existsSync)((0, core_1.getSystemPath)(replacementWith))) {
+            throw new MissingFileReplacementException((0, core_1.getSystemPath)(replacementWith));
         }
-        if (!fs_1.existsSync(core_1.getSystemPath(replace))) {
-            throw new MissingFileReplacementException(core_1.getSystemPath(replace));
+        if (!(0, fs_1.existsSync)((0, core_1.getSystemPath)(replace))) {
+            throw new MissingFileReplacementException((0, core_1.getSystemPath)(replace));
         }
     }
     return normalizedReplacement;
@@ -36,22 +36,22 @@ function normalizeFileReplacement(fileReplacement, root) {
     let replacePath;
     let withPath;
     if (fileReplacement.src && fileReplacement.replaceWith) {
-        replacePath = core_1.normalize(fileReplacement.src);
-        withPath = core_1.normalize(fileReplacement.replaceWith);
+        replacePath = (0, core_1.normalize)(fileReplacement.src);
+        withPath = (0, core_1.normalize)(fileReplacement.replaceWith);
     }
     else if (fileReplacement.replace && fileReplacement.with) {
-        replacePath = core_1.normalize(fileReplacement.replace);
-        withPath = core_1.normalize(fileReplacement.with);
+        replacePath = (0, core_1.normalize)(fileReplacement.replace);
+        withPath = (0, core_1.normalize)(fileReplacement.with);
     }
     else {
         throw new Error(`Invalid file replacement: ${JSON.stringify(fileReplacement)}`);
     }
     // TODO: For 7.x should this only happen if not absolute?
     if (root) {
-        replacePath = core_1.join(root, replacePath);
+        replacePath = (0, core_1.join)(root, replacePath);
     }
     if (root) {
-        withPath = core_1.join(root, withPath);
+        withPath = (0, core_1.join)(root, withPath);
     }
     return { replace: replacePath, with: withPath };
 }

package/src/utils/output-paths.js

@@ -14,12 +14,12 @@ function ensureOutputPaths(baseOutputPath, i18n) {
     const outputPaths = i18n.shouldInline
         ? [...i18n.inlineLocales].map((l) => [
             l,
-            i18n.flatOutput ? baseOutputPath : path_1.join(baseOutputPath, l),
+            i18n.flatOutput ? baseOutputPath : (0, path_1.join)(baseOutputPath, l),
         ])
         : [['', baseOutputPath]];
     for (const [, outputPath] of outputPaths) {
-        if (!fs_1.existsSync(outputPath)) {
-            fs_1.mkdirSync(outputPath, { recursive: true });
+        if (!(0, fs_1.existsSync)(outputPath)) {
+            (0, fs_1.mkdirSync)(outputPath, { recursive: true });
         }
     }
     return new Map(outputPaths);

package/src/utils/package-chunk-sort.js

@@ -12,7 +12,7 @@ const helpers_1 = require("../webpack/utils/helpers");
 function generateEntryPoints(options) {
     // Add all styles/scripts, except lazy-loaded ones.
     const extraEntryPoints = (extraEntryPoints, defaultBundleName) => {
-        const entryPoints = helpers_1.normalizeExtraEntryPoints(extraEntryPoints, defaultBundleName)
+        const entryPoints = (0, helpers_1.normalizeExtraEntryPoints)(extraEntryPoints, defaultBundleName)
             .filter((entry) => entry.inject)
             .map((entry) => entry.bundleName);
         // remove duplicates

package/src/utils/process-bundle.d.ts

@@ -5,7 +5,6 @@
  * 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
  */
-/// <reference types="packages/angular_devkit/build_angular/src/babel-bazel" />
 export declare function createI18nPlugins(locale: string, translation: unknown | undefined, missingTranslation: 'error' | 'warning' | 'ignore', shouldInline: boolean, localeDataContent?: string): Promise<{
     diagnostics: import("@angular/localize/src/tools/src/diagnostics").Diagnostics;
     plugins: import("@babel/core").PluginObj<import("@babel/core").PluginPass>[];

package/src/utils/process-bundle.js

@@ -37,30 +37,61 @@ const fs = __importStar(require("fs"));
 const path = __importStar(require("path"));
 const worker_threads_1 = require("worker_threads");
 const environment_options_1 = require("./environment-options");
+const load_esm_1 = require("./load-esm");
 // Lazy loaded webpack-sources object
 // Webpack is only imported if needed during the processing
 let webpackSources;
 const { i18n } = (worker_threads_1.workerData || {});
+/**
+ * Internal flag to enable the direct usage of the `@angular/localize` translation plugins.
+ * Their usage is currently several times slower than the string manipulation method.
+ * Future work to optimize the plugins should enable plugin usage as the default.
+ */
 const USE_LOCALIZE_PLUGINS = false;
+/**
+ * Cached instance of the `@angular/localize/tools` module.
+ * This is used to remove the need to repeatedly import the module per file translation.
+ */
+let localizeToolsModule;
+/**
+ * Attempts to load the `@angular/localize/tools` module containing the functionality to
+ * perform the file translations.
+ * This module must be dynamically loaded as it is an ESM module and this file is CommonJS.
+ */
+async function loadLocalizeTools() {
+    if (localizeToolsModule !== undefined) {
+        return;
+    }
+    // All the localize usages are setup to first try the ESM entry point then fallback to the deep imports.
+    // This provides interim compatibility while the framework is transitioned to bundled ESM packages.
+    // TODO_ESM: Remove all deep imports once `@angular/localize` is published with the `tools` entry point
+    try {
+        // Load ESM `@angular/localize/tools` using the TypeScript dynamic import workaround.
+        // Once TypeScript provides support for keeping the dynamic import this workaround can be
+        // changed to a direct dynamic import.
+        localizeToolsModule = await (0, load_esm_1.loadEsmModule)('@angular/localize/tools');
+    }
+    catch { }
+}
 async function createI18nPlugins(locale, translation, missingTranslation, shouldInline, localeDataContent) {
     const plugins = [];
-    const localizeDiag = await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/diagnostics')));
+    const localizeDiag = localizeToolsModule !== null && localizeToolsModule !== void 0 ? localizeToolsModule : (await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/diagnostics'))));
     const diagnostics = new localizeDiag.Diagnostics();
     if (shouldInline) {
-        const es2015 = await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/translate/source_files/es2015_translate_plugin')));
+        const es2015 = localizeToolsModule !== null && localizeToolsModule !== void 0 ? localizeToolsModule : (await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/translate/source_files/es2015_translate_plugin'))));
         plugins.push(
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         es2015.makeEs2015TranslatePlugin(diagnostics, (translation || {}), {
             missingTranslation: translation === undefined ? 'ignore' : missingTranslation,
         }));
-        const es5 = await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/translate/source_files/es5_translate_plugin')));
+        const es5 = localizeToolsModule !== null && localizeToolsModule !== void 0 ? localizeToolsModule : (await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/translate/source_files/es5_translate_plugin'))));
         plugins.push(
         // eslint-disable-next-line @typescript-eslint/no-explicit-any
         es5.makeEs5TranslatePlugin(diagnostics, (translation || {}), {
             missingTranslation: translation === undefined ? 'ignore' : missingTranslation,
         }));
     }
-    const inlineLocale = await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/translate/source_files/locale_plugin')));
+    const inlineLocale = localizeToolsModule !== null && localizeToolsModule !== void 0 ? localizeToolsModule : (await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/translate/source_files/locale_plugin'))));
     plugins.push(inlineLocale.makeLocalePlugin(locale));
     if (localeDataContent) {
         plugins.push({
@@ -87,9 +118,10 @@ async function inlineLocales(options) {
     if (!hasLocalizeName && !options.setLocale) {
         return inlineCopyOnly(options);
     }
+    await loadLocalizeTools();
     let ast;
     try {
-        ast = core_1.parseSync(options.code, {
+        ast = (0, core_1.parseSync)(options.code, {
             babelrc: false,
             configFile: false,
             sourceType: 'script',
@@ -126,7 +158,7 @@ async function inlineLocales(options) {
             }
         }
         const { diagnostics: localeDiagnostics, plugins } = await createI18nPlugins(locale, translations, isSourceLocale ? 'ignore' : options.missingTranslation || 'warning', true, localeDataContent);
-        const transformResult = await core_1.transformFromAstSync(ast, options.code, {
+        const transformResult = await (0, core_1.transformFromAstSync)(ast, options.code, {
             filename: options.filename,
             // using false ensures that babel will NOT search and process sourcemap comments (large memory usage)
             // The types do not include the false option even though it is valid
@@ -145,7 +177,7 @@ async function inlineLocales(options) {
         const outputPath = path.join(options.outputPath, i18n.flatOutput ? '' : locale, options.filename);
         fs.writeFileSync(outputPath, transformResult.code);
         if (options.map && transformResult.map) {
-            const outputMap = remapping_1.default([transformResult.map, options.map], () => null);
+            const outputMap = (0, remapping_1.default)([transformResult.map, options.map], () => null);
             fs.writeFileSync(outputPath + '.map', JSON.stringify(outputMap));
         }
     }
@@ -157,8 +189,8 @@ async function inlineLocalesDirect(ast, options) {
         return { file: options.filename, diagnostics: [], count: 0 };
     }
     const { default: generate } = await Promise.resolve().then(() => __importStar(require('@babel/generator')));
-    const utils = await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/source_file_utils')));
-    const localizeDiag = await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/diagnostics')));
+    const utils = localizeToolsModule !== null && localizeToolsModule !== void 0 ? localizeToolsModule : (await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/source_file_utils'))));
+    const localizeDiag = localizeToolsModule !== null && localizeToolsModule !== void 0 ? localizeToolsModule : (await Promise.resolve().then(() => __importStar(require('@angular/localize/src/tools/src/diagnostics'))));
     const diagnostics = new localizeDiag.Diagnostics();
     const positions = findLocalizePositions(ast, options, utils);
     if (positions.length === 0 && !options.setLocale) {
@@ -235,7 +267,7 @@ function findLocalizePositions(ast, options, utils) {
     const { File } = require('@babel/core');
     const file = new File({}, { code: options.code, ast });
     if (options.es5) {
-        core_1.traverse(file.ast, {
+        (0, core_1.traverse)(file.ast, {
             CallExpression(path) {
                 const callee = path.get('callee');
                 if (callee.isIdentifier() &&
@@ -255,7 +287,7 @@ function findLocalizePositions(ast, options, utils) {
         });
     }
     else {
-        core_1.traverse(file.ast, {
+        (0, core_1.traverse)(file.ast, {
             TaggedTemplateExpression(path) {
                 if (core_1.types.isIdentifier(path.node.tag) && path.node.tag.name === localizeName) {
                     const [messageParts, expressions] = unwrapTemplateLiteral(path, utils);
@@ -287,7 +319,7 @@ async function loadLocaleData(path, optimize, es5) {
     // The path is validated during option processing before the build starts
     const content = fs.readFileSync(path, 'utf8');
     // Downlevel and optimize the data
-    const transformResult = await core_1.transformAsync(content, {
+    const transformResult = await (0, core_1.transformAsync)(content, {
         filename: path,
         // The types do not include the false option even though it is valid
         // eslint-disable-next-line @typescript-eslint/no-explicit-any

package/src/utils/read-tsconfig.js

@@ -28,6 +28,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.readTsconfig = void 0;
 const path = __importStar(require("path"));
+const load_esm_1 = require("./load-esm");
 /**
  * Reads and parses a given TsConfig file.
  *
@@ -37,15 +38,12 @@ const path = __importStar(require("path"));
  */
 async function readTsconfig(tsconfigPath, workspaceRoot) {
     const tsConfigFullPath = workspaceRoot ? path.resolve(workspaceRoot, tsconfigPath) : tsconfigPath;
-    // This uses a dynamic import to load `@angular/compiler-cli` which may be ESM.
-    // CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
-    // will currently, unconditionally downlevel dynamic import into a require call.
-    // require calls cannot load ESM code and will result in a runtime error. To workaround
-    // this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
-    // Once TypeScript provides support for keeping the dynamic import this workaround can
-    // be dropped.
-    const compilerCliModule = await new Function(`return import('@angular/compiler-cli');`)();
+    // Load ESM `@angular/compiler-cli` using the TypeScript dynamic import workaround.
+    // Once TypeScript provides support for keeping the dynamic import this workaround can be
+    // changed to a direct dynamic import.
+    const compilerCliModule = await (0, load_esm_1.loadEsmModule)('@angular/compiler-cli');
     // If it is not ESM then the functions needed will be stored in the `default` property.
+    // TODO_ESM: This can be removed once `@angular/compiler-cli` is ESM only.
     const { formatDiagnostics, readConfiguration } = (compilerCliModule.readConfiguration ? compilerCliModule : compilerCliModule.default);
     const configResult = readConfiguration(tsConfigFullPath);
     if (configResult.errors && configResult.errors.length) {

package/src/utils/run-module-as-observable-fork.js

@@ -16,7 +16,7 @@ function runModuleAsObservableFork(cwd, modulePath, exportName,
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 args) {
     return new rxjs_1.Observable((obs) => {
-        const workerPath = path_1.resolve(__dirname, './run-module-worker.js');
+        const workerPath = (0, path_1.resolve)(__dirname, './run-module-worker.js');
         const debugArgRegex = /--inspect(?:-brk|-port)?|--debug(?:-brk|-port)/;
         const execArgv = process.execArgv.filter((arg) => {
             // Remove debug args.
@@ -35,7 +35,7 @@ args) {
         //     logger.error, // make it a stream
         //   ];
         // }
-        const forkedProcess = child_process_1.fork(workerPath, undefined, forkOptions);
+        const forkedProcess = (0, child_process_1.fork)(workerPath, undefined, forkOptions);
         // Cleanup.
         const killForkedProcess = () => {
             if (forkedProcess && forkedProcess.pid) {

package/src/utils/service-worker.js

@@ -32,6 +32,8 @@ const crypto = __importStar(require("crypto"));
 const fs_1 = require("fs");
 const path = __importStar(require("path"));
 const stream_1 = require("stream");
+const url_1 = require("url");
+const load_esm_1 = require("./load-esm");
 class CliFilesystem {
     constructor(base) {
         this.base = base;
@@ -45,7 +47,7 @@ class CliFilesystem {
     hash(file) {
         return new Promise((resolve, reject) => {
             const hash = crypto.createHash('sha1').setEncoding('hex');
-            stream_1.pipeline(fs_1.createReadStream(this._resolve(file)), hash, (error) => error ? reject(error) : resolve(hash.read()));
+            (0, stream_1.pipeline)((0, fs_1.createReadStream)(this._resolve(file)), hash, (error) => error ? reject(error) : resolve(hash.read()));
         });
     }
     write(file, content) {
@@ -72,22 +74,24 @@ class CliFilesystem {
     }
 }
 async function augmentAppWithServiceWorker(projectRoot, appRoot, outputPath, baseHref, ngswConfigPath) {
-    const distPath = core_1.getSystemPath(core_1.normalize(outputPath));
-    const systemProjectRoot = core_1.getSystemPath(projectRoot);
+    const distPath = (0, core_1.getSystemPath)((0, core_1.normalize)(outputPath));
+    const systemProjectRoot = (0, core_1.getSystemPath)(projectRoot);
     // Find the service worker package
     const workerPath = require.resolve('@angular/service-worker/ngsw-worker.js', {
         paths: [systemProjectRoot],
     });
-    const swConfigPath = require.resolve('@angular/service-worker/config', {
+    // Absolute paths on Windows must be `file://` URLs when using ESM. Otherwise,
+    // `c:` would be interpreted as a protocol instead of a drive letter.
+    const swConfigPath = (0, url_1.pathToFileURL)(require.resolve('@angular/service-worker/config', {
         paths: [systemProjectRoot],
-    });
+    }));
     // Determine the configuration file path
     let configPath;
     if (ngswConfigPath) {
-        configPath = core_1.getSystemPath(core_1.normalize(ngswConfigPath));
+        configPath = (0, core_1.getSystemPath)((0, core_1.normalize)(ngswConfigPath));
     }
     else {
-        configPath = path.join(core_1.getSystemPath(appRoot), 'ngsw-config.json');
+        configPath = path.join((0, core_1.getSystemPath)(appRoot), 'ngsw-config.json');
     }
     // Read the configuration file
     let config;
@@ -98,15 +102,18 @@ async function augmentAppWithServiceWorker(projectRoot, appRoot, outputPath, bas
     catch (error) {
         if (error.code === 'ENOENT') {
             throw new Error('Error: Expected to find an ngsw-config.json configuration file' +
-                ` in the ${core_1.getSystemPath(appRoot)} folder. Either provide one or` +
+                ` in the ${(0, core_1.getSystemPath)(appRoot)} folder. Either provide one or` +
                 ' disable Service Worker in the angular.json configuration file.');
         }
         else {
             throw error;
         }
     }
+    // Load ESM `@angular/service-worker/config` using the TypeScript dynamic import workaround.
+    // Once TypeScript provides support for keeping the dynamic import this workaround can be
+    // changed to a direct dynamic import.
+    const GeneratorConstructor = (await (0, load_esm_1.loadEsmModule)(swConfigPath)).Generator;
     // Generate the manifest
-    const GeneratorConstructor = require(swConfigPath).Generator;
     const generator = new GeneratorConstructor(new CliFilesystem(distPath), baseHref);
     const output = await generator.process(config);
     // Write the manifest

package/src/utils/spinner.js

@@ -24,8 +24,8 @@ class Spinner {
     constructor(text) {
         /** When false, only fail messages will be displayed. */
         this.enabled = true;
-        _Spinner_isTTY.set(this, tty_1.isTTY());
-        this.spinner = ora_1.default({
+        _Spinner_isTTY.set(this, (0, tty_1.isTTY)());
+        this.spinner = (0, ora_1.default)({
             text,
             // The below 2 options are needed because otherwise CTRL+C will be delayed
             // when the underlying process is sync.

package/src/utils/version.js

@@ -51,7 +51,7 @@ function assertCompatibleAngularVersion(projectRoot) {
     }
     const supportedAngularSemver = require('../../package.json')['peerDependencies']['@angular/compiler-cli'];
     const angularVersion = new semver_1.SemVer(angularPkgJson['version']);
-    if (!semver_1.satisfies(angularVersion, supportedAngularSemver, { includePrerelease: true })) {
+    if (!(0, semver_1.satisfies)(angularVersion, supportedAngularSemver, { includePrerelease: true })) {
         console.error(core_1.tags.stripIndents `
         This version of CLI is only compatible with Angular versions ${supportedAngularSemver},
         but Angular version ${angularVersion} was found instead.

package/src/utils/webpack-browser-config.js

@@ -42,7 +42,7 @@ async function generateWebpackConfig(workspaceRoot, projectRoot, sourceRoot, opt
         throw new Error(`The 'buildOptimizer' option cannot be used without 'aot'.`);
     }
     const tsConfigPath = path.resolve(workspaceRoot, options.tsConfig);
-    const tsConfig = await read_tsconfig_1.readTsconfig(tsConfigPath);
+    const tsConfig = await (0, read_tsconfig_1.readTsconfig)(tsConfigPath);
     const ts = await Promise.resolve().then(() => __importStar(require('typescript')));
     const scriptTarget = tsConfig.options.target || ts.ScriptTarget.ES5;
     const buildOptions = { ...options, ...extraBuildOptions };
@@ -56,15 +56,15 @@ async function generateWebpackConfig(workspaceRoot, projectRoot, sourceRoot, opt
         tsConfigPath,
         scriptTarget,
     };
-    wco.buildOptions.progress = utils_1.defaultProgress(wco.buildOptions.progress);
+    wco.buildOptions.progress = (0, utils_1.defaultProgress)(wco.buildOptions.progress);
     const partials = await Promise.all(webpackPartialGenerator(wco));
-    const webpackConfig = webpack_merge_1.merge(partials);
+    const webpackConfig = (0, webpack_merge_1.merge)(partials);
     return webpackConfig;
 }
 exports.generateWebpackConfig = generateWebpackConfig;
 async function generateI18nBrowserWebpackConfigFromContext(options, context, webpackPartialGenerator, extraBuildOptions = {}) {
     var _a;
-    const { buildOptions, i18n } = await i18n_options_1.configureI18nBuild(context, options);
+    const { buildOptions, i18n } = await (0, i18n_options_1.configureI18nBuild)(context, options);
     let target = typescript_1.ScriptTarget.ES5;
     const result = await generateBrowserWebpackConfigFromContext(buildOptions, context, (wco) => {
         target = wco.scriptTarget;
@@ -111,15 +111,15 @@ async function generateBrowserWebpackConfigFromContext(options, context, webpack
     if (!projectName) {
         throw new Error('The builder requires a target.');
     }
-    const workspaceRoot = core_1.normalize(context.workspaceRoot);
+    const workspaceRoot = (0, core_1.normalize)(context.workspaceRoot);
     const projectMetadata = await context.getProjectMetadata(projectName);
-    const projectRoot = core_1.resolve(workspaceRoot, core_1.normalize(projectMetadata.root || ''));
+    const projectRoot = (0, core_1.resolve)(workspaceRoot, (0, core_1.normalize)(projectMetadata.root || ''));
     const projectSourceRoot = projectMetadata.sourceRoot;
     const sourceRoot = projectSourceRoot
-        ? core_1.resolve(workspaceRoot, core_1.normalize(projectSourceRoot))
+        ? (0, core_1.resolve)(workspaceRoot, (0, core_1.normalize)(projectSourceRoot))
         : undefined;
-    const normalizedOptions = utils_1.normalizeBrowserSchema(workspaceRoot, projectRoot, sourceRoot, options);
-    const config = await generateWebpackConfig(core_1.getSystemPath(workspaceRoot), core_1.getSystemPath(projectRoot), sourceRoot && core_1.getSystemPath(sourceRoot), normalizedOptions, webpackPartialGenerator, context.logger, extraBuildOptions);
+    const normalizedOptions = (0, utils_1.normalizeBrowserSchema)(workspaceRoot, projectRoot, sourceRoot, options);
+    const config = await generateWebpackConfig((0, core_1.getSystemPath)(workspaceRoot), (0, core_1.getSystemPath)(projectRoot), sourceRoot && (0, core_1.getSystemPath)(sourceRoot), normalizedOptions, webpackPartialGenerator, context.logger, extraBuildOptions);
     // If builder watch support is present in the context, add watch plugin
     // This is internal only and currently only used for testing
     const watcherFactory = context.watcherFactory;
@@ -131,8 +131,8 @@ async function generateBrowserWebpackConfigFromContext(options, context, webpack
     }
     return {
         config,
-        projectRoot: core_1.getSystemPath(projectRoot),
-        projectSourceRoot: sourceRoot && core_1.getSystemPath(sourceRoot),
+        projectRoot: (0, core_1.getSystemPath)(projectRoot),
+        projectSourceRoot: sourceRoot && (0, core_1.getSystemPath)(sourceRoot),
     };
 }
 exports.generateBrowserWebpackConfigFromContext = generateBrowserWebpackConfigFromContext;

package/src/webpack/configs/browser.js

@@ -22,7 +22,7 @@ function getBrowserConfig(wco) {
         }));
     }
     if (scriptsSourceMap || stylesSourceMap) {
-        extraPlugins.push(helpers_1.getSourceMapDevTool(scriptsSourceMap, stylesSourceMap, hiddenSourceMap, false));
+        extraPlugins.push((0, helpers_1.getSourceMapDevTool)(scriptsSourceMap, stylesSourceMap, hiddenSourceMap, false));
     }
     let crossOriginLoading = false;
     if (subresourceIntegrity && crossOrigin === 'none') {

package/src/webpack/configs/common.js

@@ -39,6 +39,7 @@ const webpack_1 = require("webpack");
 const utils_1 = require("../../utils");
 const cache_path_1 = require("../../utils/cache-path");
 const environment_options_1 = require("../../utils/environment-options");
+const load_esm_1 = require("../../utils/load-esm");
 const spinner_1 = require("../../utils/spinner");
 const webpack_diagnostics_1 = require("../../utils/webpack-diagnostics");
 const plugins_1 = require("../plugins");
@@ -52,18 +53,15 @@ async function getCommonConfig(wco) {
     const extraPlugins = [];
     const extraRules = [];
     const entryPoints = {};
-    // This uses a dynamic import to load `@angular/compiler-cli` which may be ESM.
-    // CommonJS code can load ESM code via a dynamic import. Unfortunately, TypeScript
-    // will currently, unconditionally downlevel dynamic import into a require call.
-    // require calls cannot load ESM code and will result in a runtime error. To workaround
-    // this, a Function constructor is used to prevent TypeScript from changing the dynamic import.
-    // Once TypeScript provides support for keeping the dynamic import this workaround can
-    // be dropped.
-    const compilerCliModule = await new Function(`return import('@angular/compiler-cli');`)();
+    // Load ESM `@angular/compiler-cli` using the TypeScript dynamic import workaround.
+    // Once TypeScript provides support for keeping the dynamic import this workaround can be
+    // changed to a direct dynamic import.
+    const compilerCliModule = await (0, load_esm_1.loadEsmModule)('@angular/compiler-cli');
     // If it is not ESM then the values needed will be stored in the `default` property.
+    // TODO_ESM: This can be removed once `@angular/compiler-cli` is ESM only.
     const { GLOBAL_DEFS_FOR_TERSER, GLOBAL_DEFS_FOR_TERSER_WITH_AOT, VERSION: NG_VERSION, } = (compilerCliModule.GLOBAL_DEFS_FOR_TERSER ? compilerCliModule : compilerCliModule.default);
     // determine hashing format
-    const hashFormat = helpers_1.getOutputHashFormat(buildOptions.outputHashing || 'none');
+    const hashFormat = (0, helpers_1.getOutputHashFormat)(buildOptions.outputHashing || 'none');
     const buildBrowserFeatures = new utils_1.BuildBrowserFeatures(projectRoot);
     if (buildOptions.progress) {
         const spinner = new spinner_1.Spinner();
@@ -117,10 +115,10 @@ async function getCommonConfig(wco) {
         }));
     }
     // process global scripts
-    const globalScriptsByBundleName = helpers_1.normalizeExtraEntryPoints(buildOptions.scripts, 'scripts').reduce((prev, curr) => {
+    const globalScriptsByBundleName = (0, helpers_1.normalizeExtraEntryPoints)(buildOptions.scripts, 'scripts').reduce((prev, curr) => {
         const { bundleName, inject, input } = curr;
         let resolvedPath = path.resolve(root, input);
-        if (!fs_1.existsSync(resolvedPath)) {
+        if (!(0, fs_1.existsSync)(resolvedPath)) {
             try {
                 resolvedPath = require.resolve(input, { paths: [root] });
             }
@@ -225,12 +223,12 @@ async function getCommonConfig(wco) {
                     try {
                         await fs_1.promises.mkdir(path.dirname(statsOutputPath), { recursive: true });
                         await new Promise((resolve, reject) => stringifyStream(data)
-                            .pipe(fs_1.createWriteStream(statsOutputPath))
+                            .pipe((0, fs_1.createWriteStream)(statsOutputPath))
                             .on('close', resolve)
                             .on('error', reject));
                     }
                     catch (error) {
-                        webpack_diagnostics_1.addError(stats.compilation, `Unable to write stats file: ${error.message || 'unknown error'}`);
+                        (0, webpack_diagnostics_1.addError)(stats.compilation, `Unable to write stats file: ${error.message || 'unknown error'}`);
                     }
                 });
             }
@@ -285,6 +283,7 @@ async function getCommonConfig(wco) {
         context: root,
         entry: entryPoints,
         output: {
+            hashFunction: 'xxhash64',
             clean: (_a = buildOptions.deleteOutputPath) !== null && _a !== void 0 ? _a : true,
             path: path.resolve(root, buildOptions.outputPath),
             publicPath: (_b = buildOptions.deployUrl) !== null && _b !== void 0 ? _b : '',
@@ -292,7 +291,7 @@ async function getCommonConfig(wco) {
             chunkFilename: `[name]${hashFormat.chunk}.js`,
         },
         watch: buildOptions.watch,
-        watchOptions: helpers_1.getWatchOptions(buildOptions.poll),
+        watchOptions: (0, helpers_1.getWatchOptions)(buildOptions.poll),
         performance: {
             hints: false,
         },
@@ -331,7 +330,7 @@ async function getCommonConfig(wco) {
                         {
                             loader: require.resolve('../../babel/webpack-loader'),
                             options: {
-                                cacheDirectory: cache_path_1.findCachePath('babel-webpack'),
+                                cacheDirectory: (0, cache_path_1.findCachePath)('babel-webpack'),
                                 scriptTarget: wco.scriptTarget,
                                 aot: buildOptions.aot,
                                 optimize: buildOptions.buildOptimizer,
@@ -371,12 +370,12 @@ function getCacheSettings(wco, supportedBrowsers, angularVersion) {
         const packageVersion = require('../../../package.json').version;
         return {
             type: 'filesystem',
-            cacheDirectory: cache_path_1.findCachePath('angular-webpack'),
+            cacheDirectory: (0, cache_path_1.findCachePath)('angular-webpack'),
             maxMemoryGenerations: 1,
             // We use the versions and build options as the cache name. The Webpack configurations are too
             // dynamic and shared among different build types: test, build and serve.
             // None of which are "named".
-            name: crypto_1.createHash('sha1')
+            name: (0, crypto_1.createHash)('sha1')
                 .update(angularVersion)
                 .update(packageVersion)
                 .update(wco.projectRoot)

package/src/webpack/configs/dev-server.d.ts

@@ -8,7 +8,7 @@
 import { logging } from '@angular-devkit/core';
 import * as webpack from 'webpack';
 import { WebpackConfigOptions, WebpackDevServerOptions } from '../../utils/build-options';
-export declare function getDevServerConfig(wco: WebpackConfigOptions<WebpackDevServerOptions>): webpack.Configuration;
+export declare function getDevServerConfig(wco: WebpackConfigOptions<WebpackDevServerOptions>): Promise<webpack.Configuration>;
 /**
  * Resolve and build a URL _path_ that will be the root of the server. This resolved base href and
  * deploy URL from the browser options and returns a path from the root.

package/src/webpack/configs/dev-server.js

@@ -31,16 +31,17 @@ const core_1 = require("@angular-devkit/core");
 const fs_1 = require("fs");
 const path_1 = require("path");
 const url = __importStar(require("url"));
+const load_esm_1 = require("../../utils/load-esm");
 const webpack_browser_config_1 = require("../../utils/webpack-browser-config");
 const hmr_loader_1 = require("../plugins/hmr/hmr-loader");
-function getDevServerConfig(wco) {
+async function getDevServerConfig(wco) {
     const { buildOptions: { host, port, index, headers, watch, hmr, main, liveReload, proxyConfig }, logger, root, } = wco;
     const servePath = buildServePath(wco.buildOptions, logger);
     const extraRules = [];
     if (hmr) {
         extraRules.push({
             loader: hmr_loader_1.HmrLoader,
-            include: [main].map((p) => path_1.resolve(wco.root, p)),
+            include: [main].map((p) => (0, path_1.resolve)(wco.root, p)),
         });
     }
     const extraPlugins = [];
@@ -71,7 +72,7 @@ function getDevServerConfig(wco) {
                 ...headers,
             },
             historyApiFallback: !!index && {
-                index: path_1.posix.join(servePath, webpack_browser_config_1.getIndexOutputFile(index)),
+                index: path_1.posix.join(servePath, (0, webpack_browser_config_1.getIndexOutputFile)(index)),
                 disableDotRule: true,
                 htmlAcceptHeaders: ['text/html', 'application/xhtml+xml'],
                 rewrites: [
@@ -96,7 +97,7 @@ function getDevServerConfig(wco) {
             },
             liveReload,
             hot: hmr && !liveReload ? 'only' : hmr,
-            proxy: addProxyConfig(root, proxyConfig),
+            proxy: await addProxyConfig(root, proxyConfig),
             client: {
                 logging: 'info',
                 webSocketURL: getPublicHostOptions(wco.buildOptions, webSocketPath),
@@ -142,8 +143,8 @@ function getSslConfig(root, options) {
     const { ssl, sslCert, sslKey } = options;
     if (ssl && sslCert && sslKey) {
         return {
-            key: fs_1.readFileSync(path_1.resolve(root, sslKey), 'utf-8'),
-            cert: fs_1.readFileSync(path_1.resolve(root, sslCert), 'utf-8'),
+            key: (0, path_1.resolve)(root, sslKey),
+            cert: (0, path_1.resolve)(root, sslCert),
         };
     }
     return ssl;
@@ -152,13 +153,24 @@ function getSslConfig(root, options) {
  * Private method to enhance a webpack config with Proxy configuration.
  * @private
  */
-function addProxyConfig(root, proxyConfig) {
+async function addProxyConfig(root, proxyConfig) {
     if (!proxyConfig) {
         return undefined;
     }
-    const proxyPath = path_1.resolve(root, proxyConfig);
-    if (fs_1.existsSync(proxyPath)) {
-        return require(proxyPath);
+    const proxyPath = (0, path_1.resolve)(root, proxyConfig);
+    if ((0, fs_1.existsSync)(proxyPath)) {
+        try {
+            return require(proxyPath);
+        }
+        catch (e) {
+            if (e.code === 'ERR_REQUIRE_ESM') {
+                // Load the ESM configuration file using the TypeScript dynamic import workaround.
+                // Once TypeScript provides support for keeping the dynamic import this workaround can be
+                // changed to a direct dynamic import.
+                return (await (0, load_esm_1.loadEsmModule)(url.pathToFileURL(proxyPath))).default;
+            }
+            throw e;
+        }
     }
     throw new Error('Proxy config file ' + proxyPath + ' does not exist.');
 }