@angular-devkit/build-angular 15.0.0-next.1 → 15.0.0-next.2

package/src/builders/server/index.js

@@ -36,7 +36,6 @@ const build_webpack_1 = require("@angular-devkit/build-webpack");
 const path = __importStar(require("path"));
 const rxjs_1 = require("rxjs");
 const operators_1 = require("rxjs/operators");
-const typescript_1 = require("typescript");
 const utils_1 = require("../../utils");
 const i18n_inlining_1 = require("../../utils/i18n-inlining");
 const output_paths_1 = require("../../utils/output-paths");
@@ -54,7 +53,7 @@ function execute(options, context, transforms = {}) {
     (0, version_1.assertCompatibleAngularVersion)(root);
     const baseOutputPath = path.resolve(root, options.outputPath);
     let outputPaths;
-    return (0, rxjs_1.from)(initialize(options, context, transforms.webpackConfiguration)).pipe((0, operators_1.concatMap)(({ config, i18n, target }) => {
+    return (0, rxjs_1.from)(initialize(options, context, transforms.webpackConfiguration)).pipe((0, operators_1.concatMap)(({ config, i18n }) => {
         return (0, build_webpack_1.runWebpack)(config, context, {
             webpackFactory: require('webpack'),
             logging: (stats, config) => {
@@ -70,7 +69,7 @@ function execute(options, context, transforms = {}) {
             let success = output.success;
             if (success && i18n.shouldInline) {
                 outputPaths = (0, output_paths_1.ensureOutputPaths)(baseOutputPath, i18n);
-                success = await (0, i18n_inlining_1.i18nInlineEmittedFiles)(context, emittedFiles, i18n, baseOutputPath, Array.from(outputPaths.values()), [], outputPath, target <= typescript_1.ScriptTarget.ES5, options.i18nMissingTranslation);
+                success = await (0, i18n_inlining_1.i18nInlineEmittedFiles)(context, emittedFiles, i18n, baseOutputPath, Array.from(outputPaths.values()), [], outputPath, options.i18nMissingTranslation);
             }
             (0, stats_1.webpackStatsLogger)(context.logger, webpackStats, config);
             return { ...output, success };
@@ -97,21 +96,54 @@ function execute(options, context, transforms = {}) {
 exports.execute = execute;
 exports.default = (0, architect_1.createBuilder)(execute);
 async function initialize(options, context, webpackConfigurationTransform) {
+    var _a;
     // Purge old build disk cache.
     await (0, purge_cache_1.purgeStaleBuildCache)(context);
+    const browserslist = (await Promise.resolve().then(() => __importStar(require('browserslist')))).default;
     const originalOutputPath = options.outputPath;
-    const { config, i18n, target } = await (0, webpack_browser_config_1.generateI18nBrowserWebpackConfigFromContext)({
+    const { config, i18n } = await (0, webpack_browser_config_1.generateI18nBrowserWebpackConfigFromContext)({
         ...options,
         buildOptimizer: false,
         aot: true,
         platform: 'server',
-    }, context, (wco) => [(0, configs_1.getCommonConfig)(wco), (0, configs_1.getStylesConfig)(wco)]);
-    let transformedConfig;
-    if (webpackConfigurationTransform) {
-        transformedConfig = await webpackConfigurationTransform(config);
-    }
+    }, context, (wco) => {
+        var _a;
+        var _b;
+        // We use the platform to determine the JavaScript syntax output.
+        (_a = (_b = wco.buildOptions).supportedBrowsers) !== null && _a !== void 0 ? _a : (_b.supportedBrowsers = []);
+        wco.buildOptions.supportedBrowsers.push(...browserslist('maintained node versions'));
+        return [getPlatformServerExportsConfig(wco), (0, configs_1.getCommonConfig)(wco), (0, configs_1.getStylesConfig)(wco)];
+    });
     if (options.deleteOutputPath) {
         (0, utils_1.deleteOutputDir)(context.workspaceRoot, originalOutputPath);
     }
-    return { config: transformedConfig || config, i18n, target };
+    const transformedConfig = (_a = (await (webpackConfigurationTransform === null || webpackConfigurationTransform === void 0 ? void 0 : webpackConfigurationTransform(config)))) !== null && _a !== void 0 ? _a : config;
+    return { config: transformedConfig, i18n };
+}
+/**
+ * Add `@angular/platform-server` exports.
+ * This is needed so that DI tokens can be referenced and set at runtime outside of the bundle.
+ */
+function getPlatformServerExportsConfig(wco) {
+    // Add `@angular/platform-server` exports.
+    // This is needed so that DI tokens can be referenced and set at runtime outside of the bundle.
+    try {
+        // Only add `@angular/platform-server` exports when it is installed.
+        // In some cases this builder is used when `@angular/platform-server` is not installed.
+        // Example: when using `@nguniversal/common/clover` which does not need `@angular/platform-server`.
+        require.resolve('@angular/platform-server', { paths: [wco.root] });
+    }
+    catch {
+        return {};
+    }
+    return {
+        module: {
+            rules: [
+                {
+                    loader: require.resolve('./platform-server-exports-loader'),
+                    include: [path.resolve(wco.root, wco.buildOptions.main)],
+                },
+            ],
+        },
+    };
 }

package/src/builders/server/platform-server-exports-loader.d.ts

@@ -0,0 +1,13 @@
+/**
+ * @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
+ */
+/**
+ * This loader is needed to add additional exports and is a workaround for a Webpack bug that doesn't
+ * allow exports from multiple files in the same entry.
+ * @see https://github.com/webpack/webpack/issues/15936.
+ */
+export default function (this: import('webpack').LoaderContext<{}>, content: string, map: Parameters<import('webpack').LoaderDefinitionFunction>[1]): void;

package/src/builders/server/platform-server-exports-loader.js

@@ -0,0 +1,24 @@
+"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 });
+/**
+ * This loader is needed to add additional exports and is a workaround for a Webpack bug that doesn't
+ * allow exports from multiple files in the same entry.
+ * @see https://github.com/webpack/webpack/issues/15936.
+ */
+function default_1(content, map) {
+    const source = `${content}
+
+  // EXPORTS added by @angular-devkit/build-angular
+  export { renderModule, ɵSERVER_CONTEXT } from '@angular/platform-server';
+  `;
+    this.callback(null, source, map);
+    return;
+}
+exports.default = default_1;

package/src/utils/build-options.d.ts

@@ -60,7 +60,7 @@ export interface BuildOptions {
     cache: NormalizedCachedOptions;
     codeCoverage?: boolean;
     codeCoverageExclude?: string[];
-    supportedBrowsers: string[];
+    supportedBrowsers?: string[];
 }
 export interface WebpackDevServerOptions extends BuildOptions, Omit<DevServerSchema, 'optimization' | 'sourceMap' | 'browserTarget'> {
 }
@@ -72,6 +72,5 @@ export interface WebpackConfigOptions<T = BuildOptions> {
     buildOptions: T;
     tsConfig: ParsedConfiguration;
     tsConfigPath: string;
-    scriptTarget: import('typescript').ScriptTarget;
     projectName: string;
 }

package/src/utils/esbuild-targets.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @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
+ */
+/**
+ * Transform browserlists result to esbuild target.
+ * @see https://esbuild.github.io/api/#target
+ */
+export declare function transformSupportedBrowsersToTargets(supportedBrowsers: string[]): string[];

package/src/utils/esbuild-targets.js

@@ -0,0 +1,39 @@
+"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.transformSupportedBrowsersToTargets = void 0;
+/**
+ * Transform browserlists result to esbuild target.
+ * @see https://esbuild.github.io/api/#target
+ */
+function transformSupportedBrowsersToTargets(supportedBrowsers) {
+    const transformed = [];
+    // https://esbuild.github.io/api/#target
+    const esBuildSupportedBrowsers = new Set(['safari', 'firefox', 'edge', 'chrome', 'ios', 'node']);
+    for (const browser of supportedBrowsers) {
+        let [browserName, version] = browser.split(' ');
+        // browserslist uses the name `ios_saf` for iOS Safari whereas esbuild uses `ios`
+        if (browserName === 'ios_saf') {
+            browserName = 'ios';
+        }
+        // browserslist uses ranges `15.2-15.3` versions but only the lowest is required
+        // to perform minimum supported feature checks. esbuild also expects a single version.
+        [version] = version.split('-');
+        if (esBuildSupportedBrowsers.has(browserName)) {
+            if (browserName === 'safari' && version === 'TP') {
+                // esbuild only supports numeric versions so `TP` is converted to a high number (999) since
+                // a Technology Preview (TP) of Safari is assumed to support all currently known features.
+                version = '999';
+            }
+            transformed.push(browserName + version);
+        }
+    }
+    return transformed;
+}
+exports.transformSupportedBrowsersToTargets = transformSupportedBrowsersToTargets;

package/src/utils/i18n-inlining.d.ts

@@ -8,4 +8,4 @@
 import { BuilderContext } from '@angular-devkit/architect';
 import { EmittedFiles } from '@angular-devkit/build-webpack';
 import { I18nOptions } from './i18n-options';
-export declare function i18nInlineEmittedFiles(context: BuilderContext, emittedFiles: EmittedFiles[], i18n: I18nOptions, baseOutputPath: string, outputPaths: string[], scriptsEntryPointName: string[], emittedPath: string, es5: boolean, missingTranslation: 'error' | 'warning' | 'ignore' | undefined): Promise<boolean>;
+export declare function i18nInlineEmittedFiles(context: BuilderContext, emittedFiles: EmittedFiles[], i18n: I18nOptions, baseOutputPath: string, outputPaths: string[], scriptsEntryPointName: string[], emittedPath: string, missingTranslation: 'error' | 'warning' | 'ignore' | undefined): Promise<boolean>;

package/src/utils/i18n-inlining.js

@@ -37,7 +37,7 @@ const action_executor_1 = require("./action-executor");
 const copy_assets_1 = require("./copy-assets");
 const error_1 = require("./error");
 const spinner_1 = require("./spinner");
-function emittedFilesToInlineOptions(emittedFiles, scriptsEntryPointName, emittedPath, outputPath, es5, missingTranslation, context) {
+function emittedFilesToInlineOptions(emittedFiles, scriptsEntryPointName, emittedPath, outputPath, missingTranslation, context) {
     const options = [];
     const originalFiles = [];
     for (const emittedFile of emittedFiles) {
@@ -50,7 +50,6 @@ function emittedFilesToInlineOptions(emittedFiles, scriptsEntryPointName, emitte
         const action = {
             filename: emittedFile.file,
             code: fs.readFileSync(originalPath, 'utf8'),
-            es5,
             outputPath,
             missingTranslation,
             setLocale: emittedFile.name === 'main' || emittedFile.name === 'vendor',
@@ -72,13 +71,13 @@ function emittedFilesToInlineOptions(emittedFiles, scriptsEntryPointName, emitte
     }
     return { options, originalFiles };
 }
-async function i18nInlineEmittedFiles(context, emittedFiles, i18n, baseOutputPath, outputPaths, scriptsEntryPointName, emittedPath, es5, missingTranslation) {
+async function i18nInlineEmittedFiles(context, emittedFiles, i18n, baseOutputPath, outputPaths, scriptsEntryPointName, emittedPath, missingTranslation) {
     const executor = new action_executor_1.BundleActionExecutor({ i18n });
     let hasErrors = false;
     const spinner = new spinner_1.Spinner();
     spinner.start('Generating localized bundles...');
     try {
-        const { options, originalFiles: processedFiles } = emittedFilesToInlineOptions(emittedFiles, scriptsEntryPointName, emittedPath, baseOutputPath, es5, missingTranslation, context);
+        const { options, originalFiles: processedFiles } = emittedFilesToInlineOptions(emittedFiles, scriptsEntryPointName, emittedPath, baseOutputPath, missingTranslation, context);
         for await (const result of executor.inlineAll(options)) {
             context.logger.debug(`i18n file processed: ${result.file}`);
             for (const diagnostic of result.diagnostics) {

package/src/utils/normalize-builder-schema.d.ts

@@ -5,7 +5,7 @@
  * 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 { json } from '@angular-devkit/core';
+import { json, logging } from '@angular-devkit/core';
 import { AssetPatternClass, Schema as BrowserBuilderSchema, SourceMapClass } from '../builders/browser/schema';
 import { BuildOptions } from './build-options';
 import { NormalizedFileReplacement } from './normalize-file-replacements';
@@ -19,4 +19,4 @@ export declare type NormalizedBrowserBuilderSchema = BrowserBuilderSchema & Buil
     fileReplacements: NormalizedFileReplacement[];
     optimization: NormalizedOptimizationOptions;
 };
-export declare function normalizeBrowserSchema(workspaceRoot: string, projectRoot: string, projectSourceRoot: string | undefined, options: BrowserBuilderSchema, metadata: json.JsonObject): NormalizedBrowserBuilderSchema;
+export declare function normalizeBrowserSchema(workspaceRoot: string, projectRoot: string, projectSourceRoot: string | undefined, options: BrowserBuilderSchema, metadata: json.JsonObject, logger: logging.LoggerApi): NormalizedBrowserBuilderSchema;

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

@@ -14,7 +14,7 @@ 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");
 const supported_browsers_1 = require("./supported-browsers");
-function normalizeBrowserSchema(workspaceRoot, projectRoot, projectSourceRoot, options, metadata) {
+function normalizeBrowserSchema(workspaceRoot, projectRoot, projectSourceRoot, options, metadata, logger) {
     const normalizedSourceMapOptions = (0, normalize_source_maps_1.normalizeSourceMaps)(options.sourceMap || false);
     return {
         ...options,
@@ -37,7 +37,7 @@ function normalizeBrowserSchema(workspaceRoot, projectRoot, projectSourceRoot, o
         // A value of 0 is falsy and will disable polling rather then enable
         // 500 ms is a sensible default in this case
         poll: options.poll === 0 ? 500 : options.poll,
-        supportedBrowsers: (0, supported_browsers_1.getSupportedBrowsers)(projectRoot),
+        supportedBrowsers: (0, supported_browsers_1.getSupportedBrowsers)(projectRoot, logger),
     };
 }
 exports.normalizeBrowserSchema = normalizeBrowserSchema;

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

@@ -13,7 +13,6 @@ export interface InlineOptions {
     filename: string;
     code: string;
     map?: string;
-    es5: boolean;
     outputPath: string;
     missingTranslation?: 'warning' | 'error' | 'ignore';
     setLocale?: boolean;

package/src/utils/process-bundle.js

@@ -37,7 +37,7 @@ exports.inlineLocales = exports.createI18nPlugins = void 0;
 const remapping_1 = __importDefault(require("@ampproject/remapping"));
 const core_1 = require("@babel/core");
 const template_1 = __importDefault(require("@babel/template"));
-const fs = __importStar(require("fs"));
+const fs = __importStar(require("fs/promises"));
 const path = __importStar(require("path"));
 const worker_threads_1 = require("worker_threads");
 const environment_options_1 = require("./environment-options");
@@ -73,7 +73,7 @@ async function loadLocalizeTools() {
     return (0, load_esm_1.loadEsmModule)('@angular/localize/tools');
 }
 async function createI18nPlugins(locale, translation, missingTranslation, shouldInline, localeDataContent) {
-    const { Diagnostics, makeEs2015TranslatePlugin, makeEs5TranslatePlugin, makeLocalePlugin } = await loadLocalizeTools();
+    const { Diagnostics, makeEs2015TranslatePlugin, makeLocalePlugin } = await loadLocalizeTools();
     const plugins = [];
     const diagnostics = new Diagnostics();
     if (shouldInline) {
@@ -82,11 +82,6 @@ async function createI18nPlugins(locale, translation, missingTranslation, should
         makeEs2015TranslatePlugin(diagnostics, (translation || {}), {
             missingTranslation: translation === undefined ? 'ignore' : missingTranslation,
         }));
-        plugins.push(
-        // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        makeEs5TranslatePlugin(diagnostics, (translation || {}), {
-            missingTranslation: translation === undefined ? 'ignore' : missingTranslation,
-        }));
     }
     plugins.push(makeLocalePlugin(locale));
     if (localeDataContent) {
@@ -149,7 +144,7 @@ async function inlineLocales(options) {
             // If locale data is provided, load it and prepend to file
             const localeDataPath = (_a = i18n.locales[locale]) === null || _a === void 0 ? void 0 : _a.dataPath;
             if (localeDataPath) {
-                localeDataContent = await loadLocaleData(localeDataPath, true, options.es5);
+                localeDataContent = await loadLocaleData(localeDataPath, true);
             }
         }
         const { diagnostics: localeDiagnostics, plugins } = await createI18nPlugins(locale, translations, isSourceLocale ? 'ignore' : options.missingTranslation || 'warning', true, localeDataContent);
@@ -170,10 +165,10 @@ async function inlineLocales(options) {
             throw new Error(`Unknown error occurred processing bundle for "${options.filename}".`);
         }
         const outputPath = path.join(options.outputPath, i18n.flatOutput ? '' : locale, options.filename);
-        fs.writeFileSync(outputPath, transformResult.code);
+        await fs.writeFile(outputPath, transformResult.code);
         if (options.map && transformResult.map) {
             const outputMap = (0, remapping_1.default)([transformResult.map, options.map], () => null);
-            fs.writeFileSync(outputPath + '.map', JSON.stringify(outputMap));
+            await fs.writeFile(outputPath + '.map', JSON.stringify(outputMap));
         }
     }
     return { file: options.filename, diagnostics };
@@ -221,7 +216,7 @@ async function inlineLocalesDirect(ast, options) {
             let localeDataSource;
             const localeDataPath = i18n.locales[locale] && i18n.locales[locale].dataPath;
             if (localeDataPath) {
-                const localeDataContent = await loadLocaleData(localeDataPath, true, options.es5);
+                const localeDataContent = await loadLocaleData(localeDataPath, true);
                 localeDataSource = new OriginalSource(localeDataContent, path.basename(localeDataPath));
             }
             outputSource = localeDataSource
@@ -231,26 +226,26 @@ async function inlineLocalesDirect(ast, options) {
         }
         const { source: outputCode, map: outputMap } = outputSource.sourceAndMap();
         const outputPath = path.join(options.outputPath, i18n.flatOutput ? '' : locale, options.filename);
-        fs.writeFileSync(outputPath, outputCode);
+        await fs.writeFile(outputPath, outputCode);
         if (inputMap && outputMap) {
             outputMap.file = options.filename;
             if (mapSourceRoot) {
                 outputMap.sourceRoot = mapSourceRoot;
             }
-            fs.writeFileSync(outputPath + '.map', JSON.stringify(outputMap));
+            await fs.writeFile(outputPath + '.map', JSON.stringify(outputMap));
         }
     }
     return { file: options.filename, diagnostics: diagnostics.messages, count: positions.length };
 }
-function inlineCopyOnly(options) {
+async function inlineCopyOnly(options) {
     if (!i18n) {
         throw new Error('i18n options are missing');
     }
     for (const locale of i18n.inlineLocales) {
         const outputPath = path.join(options.outputPath, i18n.flatOutput ? '' : locale, options.filename);
-        fs.writeFileSync(outputPath, options.code);
+        await fs.writeFile(outputPath, options.code);
         if (options.map) {
-            fs.writeFileSync(outputPath + '.map', options.map);
+            await fs.writeFile(outputPath + '.map', options.map);
         }
     }
     return { file: options.filename, diagnostics: [], count: 0 };
@@ -260,43 +255,21 @@ function findLocalizePositions(ast, options, utils) {
     // Workaround to ensure a path hub is present for traversal
     const { File } = require('@babel/core');
     const file = new File({}, { code: options.code, ast });
-    if (options.es5) {
-        (0, core_1.traverse)(file.ast, {
-            CallExpression(path) {
-                const callee = path.get('callee');
-                if (callee.isIdentifier() &&
-                    callee.node.name === localizeName &&
-                    utils.isGlobalIdentifier(callee)) {
-                    const [messageParts, expressions] = unwrapLocalizeCall(path, utils);
-                    positions.push({
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        start: path.node.start,
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        end: path.node.end,
-                        messageParts,
-                        expressions,
-                    });
-                }
-            },
-        });
-    }
-    else {
-        (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);
-                    positions.push({
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        start: path.node.start,
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        end: path.node.end,
-                        messageParts,
-                        expressions,
-                    });
-                }
-            },
-        });
-    }
+    (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);
+                positions.push({
+                    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                    start: path.node.start,
+                    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                    end: path.node.end,
+                    messageParts,
+                    expressions,
+                });
+            }
+        },
+    });
     return positions;
 }
 function unwrapTemplateLiteral(path, utils) {
@@ -309,9 +282,9 @@ function unwrapLocalizeCall(path, utils) {
     const [expressions] = utils.unwrapSubstitutionsFromLocalizeCall(path);
     return [messageParts, expressions];
 }
-async function loadLocaleData(path, optimize, es5) {
+async function loadLocaleData(path, optimize) {
     // The path is validated during option processing before the build starts
-    const content = fs.readFileSync(path, 'utf8');
+    const content = await fs.readFile(path, 'utf8');
     // Downlevel and optimize the data
     const transformResult = await (0, core_1.transformAsync)(content, {
         filename: path,
@@ -325,8 +298,7 @@ async function loadLocaleData(path, optimize, es5) {
                 require.resolve('@babel/preset-env'),
                 {
                     bugfixes: true,
-                    // IE 11 is the oldest supported browser
-                    targets: es5 ? { ie: '11' } : { esmodules: true },
+                    targets: { esmodules: true },
                 },
             ],
         ],

package/src/utils/supported-browsers.d.ts

@@ -5,4 +5,5 @@
  * 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 getSupportedBrowsers(projectRoot: string): string[];
+import { logging } from '@angular-devkit/core';
+export declare function getSupportedBrowsers(projectRoot: string, logger: logging.LoggerApi): string[];

package/src/utils/supported-browsers.js

@@ -12,7 +12,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getSupportedBrowsers = void 0;
 const browserslist_1 = __importDefault(require("browserslist"));
-function getSupportedBrowsers(projectRoot) {
+function getSupportedBrowsers(projectRoot, logger) {
     browserslist_1.default.defaults = [
         'last 1 Chrome version',
         'last 1 Firefox version',
@@ -21,6 +21,22 @@ function getSupportedBrowsers(projectRoot) {
         'last 2 iOS major versions',
         'Firefox ESR',
     ];
-    return (0, browserslist_1.default)(undefined, { path: projectRoot });
+    // Get browsers from config or default.
+    const browsersFromConfigOrDefault = new Set((0, browserslist_1.default)(undefined, { path: projectRoot }));
+    // Get browsers that support ES6 modules.
+    const browsersThatSupportEs6 = new Set((0, browserslist_1.default)('supports es6-module'));
+    const unsupportedBrowsers = [];
+    for (const browser of browsersFromConfigOrDefault) {
+        if (!browsersThatSupportEs6.has(browser)) {
+            browsersFromConfigOrDefault.delete(browser);
+            unsupportedBrowsers.push(browser);
+        }
+    }
+    if (unsupportedBrowsers.length) {
+        logger.warn(`One or more browsers which are configured in the project's Browserslist configuration ` +
+            'will be ignored as ES5 output is not supported by the Angular CLI.\n' +
+            `Ignored browsers: ${unsupportedBrowsers.join(', ')}`);
+    }
+    return Array.from(browsersFromConfigOrDefault);
 }
 exports.getSupportedBrowsers = getSupportedBrowsers;

package/src/utils/webpack-browser-config.d.ts

@@ -7,7 +7,6 @@
  */
 import { BuilderContext } from '@angular-devkit/architect';
 import { logging } from '@angular-devkit/core';
-import { ScriptTarget } from 'typescript';
 import { Configuration } from 'webpack';
 import { Schema as BrowserBuilderSchema } from '../builders/browser/schema';
 import { NormalizedBrowserBuilderSchema } from '../utils';
@@ -21,7 +20,6 @@ export declare function generateI18nBrowserWebpackConfigFromContext(options: Bro
     projectRoot: string;
     projectSourceRoot?: string;
     i18n: I18nOptions;
-    target: ScriptTarget;
 }>;
 export declare function generateBrowserWebpackConfigFromContext(options: BrowserBuilderSchema, context: BuilderContext, webpackPartialGenerator: WebpackPartialGenerator, extraBuildOptions?: Partial<NormalizedBrowserBuilderSchema>): Promise<{
     config: Configuration;

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

@@ -32,7 +32,6 @@ var __importStar = (this && this.__importStar) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getIndexInputFile = exports.getIndexOutputFile = exports.generateBrowserWebpackConfigFromContext = exports.generateI18nBrowserWebpackConfigFromContext = exports.generateWebpackConfig = void 0;
 const path = __importStar(require("path"));
-const typescript_1 = require("typescript");
 const webpack_1 = require("webpack");
 const webpack_merge_1 = require("webpack-merge");
 const utils_1 = require("../utils");
@@ -46,8 +45,6 @@ async function generateWebpackConfig(workspaceRoot, projectRoot, sourceRoot, pro
     }
     const tsConfigPath = path.resolve(workspaceRoot, options.tsConfig);
     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 };
     const wco = {
         root: workspaceRoot,
@@ -58,7 +55,6 @@ async function generateWebpackConfig(workspaceRoot, projectRoot, sourceRoot, pro
         tsConfig,
         tsConfigPath,
         projectName,
-        scriptTarget,
     };
     wco.buildOptions.progress = (0, utils_1.defaultProgress)(wco.buildOptions.progress);
     const partials = await Promise.all(webpackPartialGenerator(wco));
@@ -69,9 +65,7 @@ exports.generateWebpackConfig = generateWebpackConfig;
 async function generateI18nBrowserWebpackConfigFromContext(options, context, webpackPartialGenerator, extraBuildOptions = {}) {
     var _a;
     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;
         return webpackPartialGenerator(wco);
     }, extraBuildOptions);
     const config = result.config;
@@ -107,7 +101,7 @@ async function generateI18nBrowserWebpackConfigFromContext(options, context, web
             },
         });
     }
-    return { ...result, i18n, target };
+    return { ...result, i18n };
 }
 exports.generateI18nBrowserWebpackConfigFromContext = generateI18nBrowserWebpackConfigFromContext;
 async function generateBrowserWebpackConfigFromContext(options, context, webpackPartialGenerator, extraBuildOptions = {}) {
@@ -121,7 +115,7 @@ async function generateBrowserWebpackConfigFromContext(options, context, webpack
     const projectRoot = path.join(workspaceRoot, (_a = projectMetadata.root) !== null && _a !== void 0 ? _a : '');
     const sourceRoot = projectMetadata.sourceRoot;
     const projectSourceRoot = sourceRoot ? path.join(workspaceRoot, sourceRoot) : undefined;
-    const normalizedOptions = (0, utils_1.normalizeBrowserSchema)(workspaceRoot, projectRoot, projectSourceRoot, options, projectMetadata);
+    const normalizedOptions = (0, utils_1.normalizeBrowserSchema)(workspaceRoot, projectRoot, projectSourceRoot, options, projectMetadata, context.logger);
     const config = await generateWebpackConfig(workspaceRoot, projectRoot, projectSourceRoot, projectName, 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

package/src/webpack/configs/common.js

@@ -37,7 +37,6 @@ exports.getCommonConfig = void 0;
 const webpack_1 = require("@ngtools/webpack");
 const copy_webpack_plugin_1 = __importDefault(require("copy-webpack-plugin"));
 const path = __importStar(require("path"));
-const typescript_1 = require("typescript");
 const webpack_2 = require("webpack");
 const webpack_subresource_integrity_1 = require("webpack-subresource-integrity");
 const environment_options_1 = require("../../utils/environment-options");
@@ -47,14 +46,14 @@ const devtools_ignore_plugin_1 = require("../plugins/devtools-ignore-plugin");
 const named_chunks_plugin_1 = require("../plugins/named-chunks-plugin");
 const progress_plugin_1 = require("../plugins/progress-plugin");
 const transfer_size_plugin_1 = require("../plugins/transfer-size-plugin");
-const typescript_2 = require("../plugins/typescript");
+const typescript_1 = require("../plugins/typescript");
 const watch_files_logs_plugin_1 = require("../plugins/watch-files-logs-plugin");
 const helpers_1 = require("../utils/helpers");
 const VENDORS_TEST = /[\\/]node_modules[\\/]/;
 // eslint-disable-next-line max-lines-per-function
 async function getCommonConfig(wco) {
     var _a, _b;
-    const { root, projectRoot, buildOptions, tsConfig, projectName, sourceRoot, tsConfigPath, scriptTarget, } = wco;
+    const { root, projectRoot, buildOptions, tsConfig, projectName, sourceRoot, tsConfigPath } = wco;
     const { cache, codeCoverage, crossOrigin = 'none', platform = 'browser', aot = true, codeCoverageExclude = [], main, polyfills, sourceMap: { styles: stylesSourceMap, scripts: scriptsSourceMap, vendor: vendorSourceMap, hidden: hiddenSourceMap, }, optimization: { styles: stylesOptimization, scripts: scriptsOptimization }, commonChunk, vendorChunk, subresourceIntegrity, verbose, poll, webWorkerTsConfig, externalDependencies = [], allowedCommonJsDependencies, bundleDependencies, } = buildOptions;
     const isPlatformServer = buildOptions.platform === 'server';
     const extraPlugins = [];
@@ -185,17 +184,17 @@ async function getCommonConfig(wco) {
                 /[\\/]node_modules[/\\](?:css-loader|mini-css-extract-plugin|webpack-dev-server|webpack)[/\\]/,
             ],
         });
-        extraPlugins.push((0, typescript_2.createIvyPlugin)(wco, aot, tsConfigPath));
+        extraPlugins.push((0, typescript_1.createIvyPlugin)(wco, aot, tsConfigPath));
     }
     if (webWorkerTsConfig) {
-        extraPlugins.push((0, typescript_2.createIvyPlugin)(wco, false, path.resolve(wco.root, webWorkerTsConfig)));
+        extraPlugins.push((0, typescript_1.createIvyPlugin)(wco, false, path.resolve(wco.root, webWorkerTsConfig)));
     }
     const extraMinimizers = [];
     if (scriptsOptimization) {
         extraMinimizers.push(new plugins_1.JavaScriptOptimizerPlugin({
             define: buildOptions.aot ? GLOBAL_DEFS_FOR_TERSER_WITH_AOT : GLOBAL_DEFS_FOR_TERSER,
             sourcemap: scriptsSourceMap,
-            target: scriptTarget,
+            supportedBrowsers: buildOptions.supportedBrowsers,
             keepIdentifierNames: !environment_options_1.allowMangle || isPlatformServer,
             keepNames: isPlatformServer,
             removeLicenses: buildOptions.extractLicenses,
@@ -219,17 +218,17 @@ async function getCommonConfig(wco) {
     return {
         mode: scriptsOptimization || stylesOptimization.minify ? 'production' : 'development',
         devtool: false,
-        target: [
-            isPlatformServer ? 'node' : 'web',
-            scriptTarget === typescript_1.ScriptTarget.ES5 ? 'es5' : 'es2015',
-        ],
+        target: [isPlatformServer ? 'node' : 'web', 'es2015'],
         profile: buildOptions.statsJson,
         resolve: {
             roots: [projectRoot],
             extensions: ['.ts', '.tsx', '.mjs', '.js'],
             symlinks: !buildOptions.preserveSymlinks,
             modules: [tsConfig.options.baseUrl || projectRoot, 'node_modules'],
-            ...(0, helpers_1.getMainFieldsAndConditionNames)(scriptTarget, isPlatformServer),
+            mainFields: isPlatformServer
+                ? ['es2020', 'es2015', 'module', 'main']
+                : ['es2020', 'es2015', 'browser', 'module', 'main'],
+            conditionNames: ['es2020', 'es2015', '...'],
         },
         resolveLoader: {
             symlinks: !buildOptions.preserveSymlinks,
@@ -313,7 +312,6 @@ async function getCommonConfig(wco) {
                             loader: require.resolve('../../babel/webpack-loader'),
                             options: {
                                 cacheDirectory: (cache.enabled && path.join(cache.path, 'babel-webpack')) || false,
-                                scriptTarget,
                                 aot: buildOptions.aot,
                                 optimize: buildOptions.buildOptimizer,
                                 supportedBrowsers: buildOptions.supportedBrowsers,