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

package/package.json

@@ -1,28 +1,28 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "15.0.0-next.1",
+  "version": "15.0.0-next.3",
   "description": "Angular Webpack Build Facade",
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "2.2.0",
-    "@angular-devkit/architect": "0.1500.0-next.1",
-    "@angular-devkit/build-webpack": "0.1500.0-next.1",
-    "@angular-devkit/core": "15.0.0-next.1",
-    "@babel/core": "7.19.0",
-    "@babel/generator": "7.19.0",
+    "@angular-devkit/architect": "0.1500.0-next.3",
+    "@angular-devkit/build-webpack": "0.1500.0-next.3",
+    "@angular-devkit/core": "15.0.0-next.3",
+    "@babel/core": "7.19.3",
+    "@babel/generator": "7.19.3",
     "@babel/helper-annotate-as-pure": "7.18.6",
-    "@babel/plugin-proposal-async-generator-functions": "7.19.0",
+    "@babel/plugin-proposal-async-generator-functions": "7.19.1",
     "@babel/plugin-transform-async-to-generator": "7.18.6",
-    "@babel/plugin-transform-runtime": "7.18.10",
-    "@babel/preset-env": "7.19.0",
+    "@babel/plugin-transform-runtime": "7.19.1",
+    "@babel/preset-env": "7.19.3",
     "@babel/runtime": "7.19.0",
     "@babel/template": "7.18.10",
     "@discoveryjs/json-ext": "0.5.7",
-    "@ngtools/webpack": "15.0.0-next.1",
+    "@ngtools/webpack": "15.0.0-next.3",
     "ansi-colors": "4.1.3",
-    "autoprefixer": "10.4.10",
+    "autoprefixer": "10.4.12",
     "babel-loader": "8.2.5",
     "babel-plugin-istanbul": "6.1.1",
     "browserslist": "^4.9.1",
@@ -30,7 +30,7 @@
     "copy-webpack-plugin": "11.0.0",
     "critters": "0.0.16",
     "css-loader": "6.7.1",
-    "esbuild-wasm": "0.15.7",
+    "esbuild-wasm": "0.15.9",
     "glob": "8.0.3",
     "https-proxy-agent": "5.0.1",
     "inquirer": "8.2.4",
@@ -52,25 +52,23 @@
     "regenerator-runtime": "0.13.9",
     "resolve-url-loader": "5.0.0",
     "rxjs": "6.6.7",
-    "sass": "1.54.9",
+    "sass": "1.55.0",
     "sass-loader": "13.0.2",
     "semver": "7.3.7",
     "source-map-loader": "4.0.0",
     "source-map-support": "0.5.21",
-    "stylus": "0.59.0",
-    "stylus-loader": "7.0.0",
     "terser": "5.15.0",
     "text-table": "0.2.0",
     "tree-kill": "1.2.2",
     "tslib": "2.4.0",
     "webpack": "5.74.0",
     "webpack-dev-middleware": "5.3.3",
-    "webpack-dev-server": "4.11.0",
+    "webpack-dev-server": "4.11.1",
     "webpack-merge": "5.8.0",
     "webpack-subresource-integrity": "5.1.0"
   },
   "optionalDependencies": {
-    "esbuild": "0.15.7"
+    "esbuild": "0.15.9"
   },
   "peerDependencies": {
     "@angular/compiler-cli": "^15.0.0-next",

package/src/babel/presets/application.d.ts

@@ -6,7 +6,7 @@
  * found in the LICENSE file at https://angular.io/license
  */
 import type { ɵParsedTranslation } from '@angular/localize';
-import type { makeEs2015TranslatePlugin, makeEs5TranslatePlugin, makeLocalePlugin } from '@angular/localize/tools';
+import type { makeEs2015TranslatePlugin, makeLocalePlugin } from '@angular/localize/tools';
 export declare type DiagnosticReporter = (type: 'error' | 'warning' | 'info', message: string) => void;
 /**
  * An interface representing the factory functions for the `@angular/localize` translation Babel plugins.
@@ -16,7 +16,6 @@ export declare type DiagnosticReporter = (type: 'error' | 'warning' | 'info', me
  */
 export interface I18nPluginCreators {
     makeEs2015TranslatePlugin: typeof makeEs2015TranslatePlugin;
-    makeEs5TranslatePlugin: typeof makeEs5TranslatePlugin;
     makeLocalePlugin: typeof makeLocalePlugin;
 }
 export interface ApplicationPresetOptions {

package/src/babel/presets/application.js

@@ -67,14 +67,11 @@ function createI18nDiagnostics(reporter) {
 function createI18nPlugins(locale, translation, missingTranslationBehavior, diagnosticReporter, pluginCreators) {
     const diagnostics = createI18nDiagnostics(diagnosticReporter);
     const plugins = [];
-    const { makeEs5TranslatePlugin, makeEs2015TranslatePlugin, makeLocalePlugin } = pluginCreators;
+    const { makeEs2015TranslatePlugin, makeLocalePlugin } = pluginCreators;
     if (translation) {
         plugins.push(makeEs2015TranslatePlugin(diagnostics, translation, {
             missingTranslation: missingTranslationBehavior,
         }));
-        plugins.push(makeEs5TranslatePlugin(diagnostics, translation, {
-            missingTranslation: missingTranslationBehavior,
-        }));
     }
     plugins.push(makeLocalePlugin(locale));
     return plugins;

package/src/babel/webpack-loader.js

@@ -9,7 +9,6 @@
 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");
 const package_version_1 = require("../utils/package-version");
 /**
@@ -53,7 +52,7 @@ exports.default = (0, babel_loader_1.custom)(() => {
     return {
         async customOptions(options, { source, map }) {
             var _a, _b, _c;
-            const { i18n, scriptTarget, aot, optimize, instrumentCode, supportedBrowsers, ...rawOptions } = options;
+            const { i18n, aot, optimize, instrumentCode, supportedBrowsers, ...rawOptions } = options;
             // Must process file if plugins are added
             let shouldProcess = Array.isArray(rawOptions.plugins) && rawOptions.plugins.length > 0;
             const customOptions = {
@@ -78,31 +77,18 @@ exports.default = (0, babel_loader_1.custom)(() => {
                 shouldProcess = true;
             }
             // Analyze for ES target processing
-            const esTarget = scriptTarget;
-            const isJsFile = /\.[cm]?js$/.test(this.resourcePath);
-            // The below should be dropped when we no longer support ES5 TypeScript output.
-            if (esTarget === typescript_1.ScriptTarget.ES5) {
-                // This is needed because when target is ES5 we change the TypeScript target to ES2015
-                // because it simplifies build-optimization passes.
-                // @see https://github.com/angular/angular-cli/blob/22af6520834171d01413d4c7e4a9f13fb752252e/packages/angular_devkit/build_angular/src/webpack/plugins/typescript.ts#L51-L56
-                customOptions.forcePresetEnv = true;
-                // Comparable behavior to tsconfig target of ES5
-                customOptions.supportedBrowsers = ['IE 9'];
-            }
-            else if (isJsFile && ((_a = customOptions.supportedBrowsers) === null || _a === void 0 ? void 0 : _a.length)) {
+            if ((_a = customOptions.supportedBrowsers) === null || _a === void 0 ? void 0 : _a.length) {
                 // Applications code ES version can be controlled using TypeScript's `target` option.
                 // However, this doesn't effect libraries and hence we use preset-env to downlevel ES fetaures
                 // based on the supported browsers in browserlist.
                 customOptions.forcePresetEnv = true;
             }
-            if ((esTarget !== undefined && esTarget >= typescript_1.ScriptTarget.ES2017) || isJsFile) {
-                // Application code (TS files) will only contain native async if target is ES2017+.
-                // However, third-party libraries can regardless of the target option.
-                // APF packages with code in [f]esm2015 directories is downlevelled to ES2015 and
-                // will not have native async.
-                customOptions.forceAsyncTransformation =
-                    !/[\\/][_f]?esm2015[\\/]/.test(this.resourcePath) && source.includes('async');
-            }
+            // Application code (TS files) will only contain native async if target is ES2017+.
+            // However, third-party libraries can regardless of the target option.
+            // APF packages with code in [f]esm2015 directories is downlevelled to ES2015 and
+            // will not have native async.
+            customOptions.forceAsyncTransformation =
+                !/[\\/][_f]?esm2015[\\/]/.test(this.resourcePath) && source.includes('async');
             shouldProcess || (shouldProcess = customOptions.forceAsyncTransformation || customOptions.forcePresetEnv || false);
             // Analyze for i18n inlining
             if (i18n &&

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

@@ -29,8 +29,12 @@ var __importStar = (this && this.__importStar) || function (mod) {
     __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 });
 const architect_1 = require("@angular-devkit/architect");
+const assert_1 = __importDefault(require("assert"));
 const fs = __importStar(require("fs"));
 const path = __importStar(require("path"));
 const utils_1 = require("../../utils");
@@ -67,17 +71,21 @@ async function _renderUniversal(options, context, browserResult, serverResult, s
         const browserIndexOutputPath = path.join(outputPath, 'index.html');
         const indexHtml = await fs.promises.readFile(browserIndexOutputPath, 'utf8');
         const serverBundlePath = await _getServerModuleBundlePath(options, context, serverResult, localeDirectory);
-        const { AppServerModule, renderModule } = await Promise.resolve().then(() => __importStar(require(serverBundlePath)));
-        const renderModuleFn = renderModule;
-        if (!(renderModuleFn && AppServerModule)) {
-            throw new Error(`renderModule method and/or AppServerModule were not exported from: ${serverBundlePath}.`);
-        }
+        const { AppServerModule, renderModule, ɵSERVER_CONTEXT } = (await Promise.resolve().then(() => __importStar(require(serverBundlePath))));
+        (0, assert_1.default)(renderModule, `renderModule was not exported from: ${serverBundlePath}.`);
+        (0, assert_1.default)(AppServerModule, `AppServerModule was not exported from: ${serverBundlePath}.`);
+        (0, assert_1.default)(ɵSERVER_CONTEXT, `ɵSERVER_CONTEXT was not exported from: ${serverBundlePath}.`);
         // Load platform server module renderer
-        const renderOpts = {
+        let html = await renderModule(AppServerModule, {
             document: indexHtml,
             url: options.route,
-        };
-        let html = await renderModuleFn(AppServerModule, renderOpts);
+            extraProviders: [
+                {
+                    provide: ɵSERVER_CONTEXT,
+                    useValue: 'app-shell',
+                },
+            ],
+        });
         // Overwrite the client index file.
         const outputIndexPath = options.outputIndexPath
             ? path.join(root, options.outputIndexPath)

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

@@ -44,5 +44,5 @@ export declare function buildWebpackBrowser(options: BrowserBuilderSchema, conte
     logging?: WebpackLoggingCallback;
     indexHtml?: IndexHtmlTransform;
 }): Observable<BrowserBuilderOutput>;
-declare const _default: import("@angular-devkit/architect/src/internal").Builder<BrowserBuilderSchema & import("@angular-devkit/core").JsonObject>;
+declare const _default: import("@angular-devkit/architect/src/internal").Builder<BrowserBuilderSchema & import("../../../../core/src").JsonObject>;
 export default _default;

package/src/builders/browser/index.js

@@ -37,7 +37,6 @@ const fs = __importStar(require("fs"));
 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 bundle_calculator_1 = require("../../utils/bundle-calculator");
 const color_1 = require("../../utils/color");
@@ -51,7 +50,6 @@ const package_chunk_sort_1 = require("../../utils/package-chunk-sort");
 const purge_cache_1 = require("../../utils/purge-cache");
 const service_worker_1 = require("../../utils/service-worker");
 const spinner_1 = require("../../utils/spinner");
-const supported_browsers_1 = require("../../utils/supported-browsers");
 const version_1 = require("../../utils/version");
 const webpack_browser_config_1 = require("../../utils/webpack-browser-config");
 const configs_1 = require("../../webpack/configs");
@@ -68,7 +66,7 @@ async function initialize(options, context, webpackConfigurationTransform) {
     const originalOutputPath = options.outputPath;
     // Assets are processed directly by the builder except when watching
     const adjustedOptions = options.watch ? options : { ...options, assets: [] };
-    const { config, projectRoot, projectSourceRoot, i18n, target } = await (0, webpack_browser_config_1.generateI18nBrowserWebpackConfigFromContext)(adjustedOptions, context, (wco) => [
+    const { config, projectRoot, projectSourceRoot, i18n } = await (0, webpack_browser_config_1.generateI18nBrowserWebpackConfigFromContext)(adjustedOptions, context, (wco) => [
         (0, configs_1.getCommonConfig)(wco),
         (0, configs_1.getStylesConfig)(wco),
         (0, configs_1.getAnalyticsConfig)(wco, context),
@@ -88,7 +86,7 @@ async function initialize(options, context, webpackConfigurationTransform) {
     if (options.deleteOutputPath) {
         (0, utils_1.deleteOutputDir)(context.workspaceRoot, originalOutputPath);
     }
-    return { config: transformedConfig || config, projectRoot, projectSourceRoot, i18n, target };
+    return { config: transformedConfig || config, projectRoot, projectSourceRoot, i18n };
 }
 /**
  * @experimental Direct usage of this function is considered experimental.
@@ -111,8 +109,6 @@ function buildWebpackBrowser(options, context, transforms = {}) {
         await (0, purge_cache_1.purgeStaleBuildCache)(context);
         // Initialize builder
         const initialization = await initialize(options, context, transforms.webpackConfiguration);
-        // Check and warn about IE browser support
-        checkInternetExplorerSupport(initialization.projectRoot, context.logger);
         // Add index file to watched files.
         if (options.watch) {
             const indexInputFile = path.join(context.workspaceRoot, (0, webpack_browser_config_1.getIndexInputFile)(options.index));
@@ -131,7 +127,7 @@ function buildWebpackBrowser(options, context, transforms = {}) {
         };
     }), (0, operators_1.switchMap)(
     // eslint-disable-next-line max-lines-per-function
-    ({ config, projectRoot, projectSourceRoot, i18n, target, cacheOptions }) => {
+    ({ config, projectRoot, projectSourceRoot, i18n, cacheOptions }) => {
         const normalizedOptimization = (0, utils_1.normalizeOptimization)(options.optimization);
         return (0, build_webpack_1.runWebpack)(config, context, {
             webpackFactory: require('webpack'),
@@ -174,7 +170,7 @@ function buildWebpackBrowser(options, context, transforms = {}) {
                 outputPaths = (0, output_paths_1.ensureOutputPaths)(baseOutputPath, i18n);
                 const scriptsEntryPointName = (0, helpers_1.normalizeExtraEntryPoints)(options.scripts || [], 'scripts').map((x) => x.bundleName);
                 if (i18n.shouldInline) {
-                    const success = await (0, i18n_inlining_1.i18nInlineEmittedFiles)(context, emittedFiles, i18n, baseOutputPath, Array.from(outputPaths.values()), scriptsEntryPointName, webpackOutputPath, target <= typescript_1.ScriptTarget.ES5, options.i18nMissingTranslation);
+                    const success = await (0, i18n_inlining_1.i18nInlineEmittedFiles)(context, emittedFiles, i18n, baseOutputPath, Array.from(outputPaths.values()), scriptsEntryPointName, webpackOutputPath, options.i18nMissingTranslation);
                     if (!success) {
                         return { success: false };
                     }
@@ -330,12 +326,4 @@ function mapEmittedFilesToFileInfo(files = []) {
     }
     return filteredFiles;
 }
-function checkInternetExplorerSupport(projectRoot, logger) {
-    const supportedBrowsers = (0, supported_browsers_1.getSupportedBrowsers)(projectRoot);
-    if (supportedBrowsers.some((b) => b === 'ie 9' || b === 'ie 10' || b === 'ie 11')) {
-        logger.warn(`Warning: Support was requested for Internet Explorer in the project's browserslist configuration. ` +
-            'Internet Explorer is no longer officially supported.' +
-            '\nFor more information, see https://angular.io/guide/browser-support');
-    }
-}
 exports.default = (0, architect_1.createBuilder)(buildWebpackBrowser);

package/src/builders/browser/schema.d.ts

@@ -106,9 +106,9 @@ export interface Schema {
      */
     poll?: number;
     /**
-     * The full path for the polyfills file, relative to the current workspace.
+     * Polyfills to be included in the build.
      */
-    polyfills?: string;
+    polyfills?: Polyfills;
     /**
      * Do not use the real path when resolving modules. If unset then will default to `true` if
      * NodeJS option --preserve-symlinks is set.
@@ -359,6 +359,10 @@ export declare enum OutputHashing {
     Media = "media",
     None = "none"
 }
+/**
+ * Polyfills to be included in the build.
+ */
+export declare type Polyfills = string[] | string;
 export declare type ScriptElement = ScriptClass | string;
 export interface ScriptClass {
     /**

package/src/builders/browser/schema.json

@@ -17,8 +17,22 @@
       "description": "The full path for the main entry point to the app, relative to the current workspace."
     },
     "polyfills": {
-      "type": "string",
-      "description": "The full path for the polyfills file, relative to the current workspace."
+      "description": "Polyfills to be included in the build.",
+      "oneOf": [
+        {
+          "type": "array",
+          "description": "A list of polyfills to include in the build. Can be a full path for a file, relative to the current workspace or module specifier. Example: 'zone.js'.",
+          "items": {
+            "type": "string",
+            "uniqueItems": true
+          },
+          "default": []
+        },
+        {
+          "type": "string",
+          "description": "The full path for the polyfills file, relative to the current workspace or a module specifier. Example: 'zone.js'."
+        }
+      ]
     },
     "tsConfig": {
       "type": "string",
@@ -72,7 +86,7 @@
               "input": {
                 "type": "string",
                 "description": "The file to include.",
-                "pattern": "\\.(?:css|scss|sass|less|styl)$"
+                "pattern": "\\.(?:css|scss|sass|less)$"
               },
               "bundleName": {
                 "type": "string",
@@ -91,7 +105,7 @@
           {
             "type": "string",
             "description": "The file to include.",
-            "pattern": "\\.(?:css|scss|sass|less|styl)$"
+            "pattern": "\\.(?:css|scss|sass|less)$"
           }
         ]
       }

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

@@ -12,4 +12,5 @@ export declare function createCompilerPlugin(pluginOptions: {
     tsconfig: string;
     advancedOptimizations?: boolean;
     thirdPartySourcemaps?: boolean;
+    fileReplacements?: Record<string, string>;
 }, styleOptions: BundleStylesheetOptions): Plugin;

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

@@ -113,15 +113,15 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
         name: 'angular-compiler',
         // eslint-disable-next-line max-lines-per-function
         async setup(build) {
-            var _a;
-            var _b;
+            var _a, _b;
+            var _c;
             // 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 { mergeTransformers, replaceBootstrap, } = 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 = {});
+            (_a = (_c = build.initialOptions).define) !== null && _a !== void 0 ? _a : (_c.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
@@ -148,16 +148,13 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                 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();
+            if (compilerOptions.target === undefined || compilerOptions.target < typescript_1.default.ScriptTarget.ES2022) {
+                // If 'useDefineForClassFields' is already defined in the users project leave the value as is.
+                // Otherwise fallback to false due to https://github.com/microsoft/TypeScript/issues/45995
+                // which breaks the deprecated `@Effects` NGRX decorator and potentially other existing code as well.
+                compilerOptions.target = typescript_1.default.ScriptTarget.ES2022;
+                (_b = compilerOptions.useDefineForClassFields) !== null && _b !== void 0 ? _b : (compilerOptions.useDefineForClassFields = false);
+                // TODO: show warning about this override when we have access to the logger.
             }
             // The file emitter created during `onStart` that will be used during the build in `onLoad` callbacks for TS files
             let fileEmitter;
@@ -204,6 +201,12 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                     stylesheetResourceFiles.push(...resourceFiles);
                     return { content: contents };
                 };
+                // Augment TypeScript Host for file replacements option
+                if (pluginOptions.fileReplacements) {
+                    // Temporary deep import for file replacements support
+                    const { augmentHostWithReplacements } = require('@ngtools/webpack/src/ivy/host');
+                    augmentHostWithReplacements(host, pluginOptions.fileReplacements);
+                }
                 // Create the Angular specific program that contains the Angular compiler
                 const angularProgram = new compilerCli.NgtscProgram(rootNames, compilerOptions, host);
                 const angularCompiler = angularProgram.compiler;
@@ -244,9 +247,9 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                 return result;
             });
             build.onLoad({ filter: compilerOptions.allowJs ? /\.[cm]?[jt]sx?$/ : /\.[cm]?tsx?$/ }, async (args) => {
-                var _a, _b;
+                var _a, _b, _c, _d;
                 assert.ok(fileEmitter, 'Invalid plugin execution order');
-                const typescriptResult = await fileEmitter(args.path);
+                const typescriptResult = await fileEmitter((_b = (_a = pluginOptions.fileReplacements) === null || _a === void 0 ? void 0 : _a[args.path]) !== null && _b !== void 0 ? _b : 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.
@@ -268,7 +271,7 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                         ],
                     };
                 }
-                const data = (_a = typescriptResult.content) !== null && _a !== void 0 ? _a : '';
+                const data = (_c = typescriptResult.content) !== null && _c !== void 0 ? _c : '';
                 const forceAsyncTransformation = /async\s+function\s*\*/.test(data);
                 const useInputSourcemap = pluginOptions.sourcemap &&
                     (!!pluginOptions.thirdPartySourcemaps || !/[\\/]node_modules[\\/]/.test(args.path));
@@ -302,7 +305,7 @@ function createCompilerPlugin(pluginOptions, styleOptions) {
                     ],
                 });
                 return {
-                    contents: (_b = babelResult === null || babelResult === void 0 ? void 0 : babelResult.code) !== null && _b !== void 0 ? _b : '',
+                    contents: (_d = babelResult === null || babelResult === void 0 ? void 0 : babelResult.code) !== null && _d !== void 0 ? _d : '',
                     loader: 'js',
                 };
             });

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

@@ -12,7 +12,6 @@ const UNSUPPORTED_OPTIONS = [
     'allowedCommonJsDependencies',
     'budgets',
     'extractLicenses',
-    'fileReplacements',
     'progress',
     'scripts',
     'statsJson',

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

@@ -38,9 +38,11 @@ const path = __importStar(require("path"));
 const utils_1 = require("../../utils");
 const copy_assets_1 = require("../../utils/copy-assets");
 const error_1 = require("../../utils/error");
+const esbuild_targets_1 = require("../../utils/esbuild-targets");
 const index_html_generator_1 = require("../../utils/index-file/index-html-generator");
 const package_chunk_sort_1 = require("../../utils/package-chunk-sort");
 const service_worker_1 = require("../../utils/service-worker");
+const supported_browsers_1 = require("../../utils/supported-browsers");
 const webpack_browser_config_1 = require("../../utils/webpack-browser-config");
 const configs_1 = require("../../webpack/configs");
 const compiler_plugin_1 = require("./compiler-plugin");
@@ -86,11 +88,12 @@ async function buildEsbuildBrowser(options, context) {
         context.logger.error('Unable to create output directory: ' + e.message);
         return { success: false };
     }
+    const target = (0, esbuild_targets_1.transformSupportedBrowsersToTargets)((0, supported_browsers_1.getSupportedBrowsers)(projectRoot, context.logger));
     const [codeResults, styleResults] = await Promise.all([
         // Execute esbuild to bundle the application code
-        bundleCode(workspaceRoot, entryPoints, outputNames, options, optimizationOptions, sourcemapOptions, tsconfig),
+        bundleCode(workspaceRoot, entryPoints, outputNames, options, optimizationOptions, sourcemapOptions, tsconfig, target),
         // Execute esbuild to bundle the global stylesheets
-        bundleGlobalStylesheets(workspaceRoot, outputNames, options, optimizationOptions, sourcemapOptions),
+        bundleGlobalStylesheets(workspaceRoot, outputNames, options, optimizationOptions, sourcemapOptions, target),
     ]);
     // Log all warnings and errors generated during bundling
     await (0, esbuild_1.logMessages)(context, {
@@ -195,8 +198,15 @@ function createOutputFileFromText(path, text) {
         },
     };
 }
-async function bundleCode(workspaceRoot, entryPoints, outputNames, options, optimizationOptions, sourcemapOptions, tsconfig) {
+async function bundleCode(workspaceRoot, entryPoints, outputNames, options, optimizationOptions, sourcemapOptions, tsconfig, target) {
     var _a;
+    let fileReplacements;
+    if (options.fileReplacements) {
+        for (const replacement of options.fileReplacements) {
+            fileReplacements !== null && fileReplacements !== void 0 ? fileReplacements : (fileReplacements = {});
+            fileReplacements[path.join(workspaceRoot, replacement.replace)] = path.join(workspaceRoot, replacement.with);
+        }
+    }
     return (0, esbuild_1.bundle)({
         absWorkingDir: workspaceRoot,
         bundle: true,
@@ -204,7 +214,7 @@ async function bundleCode(workspaceRoot, entryPoints, outputNames, options, opti
         entryPoints,
         entryNames: outputNames.bundles,
         assetNames: outputNames.media,
-        target: 'es2020',
+        target,
         supported: {
             // Native async/await is not supported with Zone.js. Disabling support here will cause
             // esbuild to downlevel async/await and for await...of to a Zone.js supported form. However, esbuild
@@ -236,6 +246,7 @@ async function bundleCode(workspaceRoot, entryPoints, outputNames, options, opti
                 thirdPartySourcemaps: sourcemapOptions.vendor,
                 tsconfig,
                 advancedOptimizations: options.buildOptimizer,
+                fileReplacements,
             }, 
             // Component stylesheet options
             {
@@ -249,6 +260,7 @@ async function bundleCode(workspaceRoot, entryPoints, outputNames, options, opti
                 outputNames,
                 includePaths: (_a = options.stylePreprocessorOptions) === null || _a === void 0 ? void 0 : _a.includePaths,
                 externalDependencies: options.externalDependencies,
+                target,
             }),
         ],
         define: {
@@ -257,7 +269,7 @@ async function bundleCode(workspaceRoot, entryPoints, outputNames, options, opti
         },
     });
 }
-async function bundleGlobalStylesheets(workspaceRoot, outputNames, options, optimizationOptions, sourcemapOptions) {
+async function bundleGlobalStylesheets(workspaceRoot, outputNames, options, optimizationOptions, sourcemapOptions, target) {
     var _a;
     const outputFiles = [];
     const initialFiles = [];
@@ -281,6 +293,7 @@ async function bundleGlobalStylesheets(workspaceRoot, outputNames, options, opti
             includePaths: (_a = options.stylePreprocessorOptions) === null || _a === void 0 ? void 0 : _a.includePaths,
             preserveSymlinks: options.preserveSymlinks,
             externalDependencies: options.externalDependencies,
+            target,
         });
         errors.push(...sheetResult.errors);
         warnings.push(...sheetResult.warnings);

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

@@ -33,6 +33,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.normalizeOptions = void 0;
 const path = __importStar(require("path"));
 const utils_1 = require("../../utils");
+const normalize_polyfills_1 = require("../../utils/normalize-polyfills");
 const schema_1 = require("../browser/schema");
 /**
  * Normalize the user provided options by creating full paths for all path based options
@@ -52,7 +53,11 @@ async function normalizeOptions(context, projectName, options) {
     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);
+    // Currently esbuild do not support multiple files per entry-point
+    const [polyfillsEntryPoint, ...remainingPolyfills] = (0, normalize_polyfills_1.normalizePolyfills)(options.polyfills, workspaceRoot);
+    if (remainingPolyfills.length) {
+        context.logger.warn(`The 'polyfills' option currently does not support multiple entries by this experimental builder. The first entry will be used.`);
+    }
     const tsconfig = path.join(workspaceRoot, options.tsConfig);
     const outputPath = path.join(workspaceRoot, options.outputPath);
     const optimizationOptions = (0, utils_1.normalizeOptimization)(options.optimization);

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

@@ -111,9 +111,9 @@ export interface Schema {
      */
     poll?: number;
     /**
-     * The full path for the polyfills file, relative to the current workspace.
+     * Polyfills to be included in the build.
      */
-    polyfills?: string;
+    polyfills?: Polyfills;
     /**
      * Do not use the real path when resolving modules. If unset then will default to `true` if
      * NodeJS option --preserve-symlinks is set.
@@ -262,10 +262,8 @@ export declare enum CrossOrigin {
     UseCredentials = "use-credentials"
 }
 export interface FileReplacement {
-    replace?: string;
-    replaceWith?: string;
-    src?: string;
-    with?: string;
+    replace: string;
+    with: string;
 }
 /**
  * How to handle duplicate translations for i18n.
@@ -364,6 +362,10 @@ export declare enum OutputHashing {
     Media = "media",
     None = "none"
 }
+/**
+ * Polyfills to be included in the build.
+ */
+export declare type Polyfills = string[] | string;
 export declare type ScriptElement = ScriptClass | string;
 export interface ScriptClass {
     /**