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

package/src/webpack/plugins/esbuild-executor.js

@@ -0,0 +1,126 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google LLC All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.EsbuildExecutor = void 0;
+const child_process_1 = require("child_process");
+const path = __importStar(require("path"));
+/**
+ * Provides the ability to execute esbuild regardless of the current platform's support
+ * for using the native variant of esbuild. The native variant will be preferred (assuming
+ * the `alwaysUseWasm` constructor option is `false) due to its inherent performance advantages.
+ * At first use of esbuild, a supportability test will be automatically performed and the
+ * WASM-variant will be used if needed by the platform.
+ */
+class EsbuildExecutor {
+    /**
+     * Constructs an instance of the `EsbuildExecutor` class.
+     *
+     * @param alwaysUseWasm If true, the WASM-variant will be preferred and no support test will be
+     * performed; if false (default), the native variant will be preferred.
+     */
+    constructor(alwaysUseWasm = false) {
+        this.alwaysUseWasm = alwaysUseWasm;
+        this.initialized = false;
+        this.esbuildTransform = this.esbuildFormatMessages = () => {
+            throw new Error('esbuild implementation missing');
+        };
+    }
+    /**
+     * Determines whether the native variant of esbuild can be used on the current platform.
+     *
+     * @returns True, if the native variant of esbuild is support; False, if the WASM variant is required.
+     */
+    static hasNativeSupport() {
+        // Try to use native variant to ensure it is functional for the platform.
+        // Spawning a separate esbuild check process is used to determine if the native
+        // variant is viable. If check fails, the WASM variant is initialized instead.
+        // Attempting to call one of the native esbuild functions is not a viable test
+        // currently since esbuild spawn errors are currently not propagated through the
+        // call stack for the esbuild function. If this limitation is removed in the future
+        // then the separate process spawn check can be removed in favor of a direct function
+        // call check.
+        try {
+            const { status, error } = (0, child_process_1.spawnSync)(process.execPath, [
+                path.join(__dirname, '../../../esbuild-check.js'),
+            ]);
+            return status === 0 && error === undefined;
+        }
+        catch {
+            return false;
+        }
+    }
+    /**
+     * Initializes the esbuild transform and format messages functions.
+     *
+     * @returns A promise that fulfills when esbuild has been loaded and available for use.
+     */
+    async ensureEsbuild() {
+        if (this.initialized) {
+            return;
+        }
+        // If the WASM variant was preferred at class construction or native is not supported, use WASM
+        if (this.alwaysUseWasm || !EsbuildExecutor.hasNativeSupport()) {
+            await this.useWasm();
+            this.initialized = true;
+            return;
+        }
+        try {
+            // Use the faster native variant if available.
+            const { transform, formatMessages } = await Promise.resolve().then(() => __importStar(require('esbuild')));
+            this.esbuildTransform = transform;
+            this.esbuildFormatMessages = formatMessages;
+        }
+        catch {
+            // If the native variant is not installed then use the WASM-based variant
+            await this.useWasm();
+        }
+        this.initialized = true;
+    }
+    /**
+     * Transitions an executor instance to use the WASM-variant of esbuild.
+     */
+    async useWasm() {
+        const { transform, formatMessages } = await Promise.resolve().then(() => __importStar(require('esbuild-wasm')));
+        this.esbuildTransform = transform;
+        this.esbuildFormatMessages = formatMessages;
+        // The ESBUILD_BINARY_PATH environment variable cannot exist when attempting to use the
+        // WASM variant. If it is then the binary located at the specified path will be used instead
+        // of the WASM variant.
+        delete process.env.ESBUILD_BINARY_PATH;
+        this.alwaysUseWasm = true;
+    }
+    async transform(input, options) {
+        await this.ensureEsbuild();
+        return this.esbuildTransform(input, options);
+    }
+    async formatMessages(messages, options) {
+        await this.ensureEsbuild();
+        return this.esbuildFormatMessages(messages, options);
+    }
+}
+exports.EsbuildExecutor = EsbuildExecutor;

package/src/webpack/plugins/hmr/hmr-accept.js

@@ -14,7 +14,7 @@ function default_1(mod) {
     if (!mod['hot']) {
         return;
     }
-    if (!core_1.isDevMode()) {
+    if (!(0, core_1.isDevMode)()) {
         console.error(`[NG HMR] Cannot use HMR when Angular is running in production mode. To prevent production mode, do not call 'enableProdMode()'.`);
         return;
     }
@@ -29,7 +29,7 @@ function default_1(mod) {
             return;
         }
         // Reset JIT compiled components cache
-        core_1.ɵresetCompiledComponents();
+        (0, core_1.ɵresetCompiledComponents)();
         const appRoot = getAppRoot();
         if (!appRoot) {
             return;
@@ -72,7 +72,7 @@ function default_1(mod) {
             }
             // Wait until the application isStable to restore the form values
             newAppRef.isStable
-                .pipe(operators_1.filter((isStable) => !!isStable), operators_1.take(1))
+                .pipe((0, operators_1.filter)((isStable) => !!isStable), (0, operators_1.take)(1))
                 .subscribe(() => restoreFormValues(oldInputs, oldOptions));
         }).observe(bodyElement, {
             attributes: true,

package/src/webpack/plugins/hmr/hmr-loader.js

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.HmrLoader = void 0;
 const path_1 = require("path");
 exports.HmrLoader = __filename;
-const hmrAcceptPath = path_1.join(__dirname, './hmr-accept.js').replace(/\\/g, '/');
+const hmrAcceptPath = (0, path_1.join)(__dirname, './hmr-accept.js').replace(/\\/g, '/');
 function default_1(content, 
 // Source map types are broken in the webpack type definitions
 // eslint-disable-next-line @typescript-eslint/no-explicit-any

package/src/webpack/plugins/index-html-webpack-plugin.js

@@ -43,27 +43,27 @@ class IndexHtmlWebpackPlugin extends index_html_generator_1.IndexHtmlGenerator {
                         files.push({
                             name: chunk.name,
                             file,
-                            extension: path_1.extname(file),
+                            extension: (0, path_1.extname)(file),
                         });
                     }
                 }
                 const { content, warnings, errors } = await this.process({
                     files,
-                    outputPath: path_1.dirname(this.options.outputPath),
+                    outputPath: (0, path_1.dirname)(this.options.outputPath),
                     baseHref: this.options.baseHref,
                     lang: this.options.lang,
                 });
                 assets[this.options.outputPath] = new webpack_1.sources.RawSource(content);
-                warnings.forEach((msg) => webpack_diagnostics_1.addWarning(this.compilation, msg));
-                errors.forEach((msg) => webpack_diagnostics_1.addError(this.compilation, msg));
+                warnings.forEach((msg) => (0, webpack_diagnostics_1.addWarning)(this.compilation, msg));
+                errors.forEach((msg) => (0, webpack_diagnostics_1.addError)(this.compilation, msg));
             }
             catch (error) {
-                webpack_diagnostics_1.addError(this.compilation, error.message);
+                (0, webpack_diagnostics_1.addError)(this.compilation, error.message);
             }
         };
     }
     async readAsset(path) {
-        const data = this.compilation.assets[path_1.basename(path)].source();
+        const data = this.compilation.assets[(0, path_1.basename)(path)].source();
         return typeof data === 'string' ? data : data.toString();
     }
     async readIndex(path) {

package/src/webpack/plugins/javascript-optimizer-plugin.js

@@ -14,6 +14,7 @@ exports.JavaScriptOptimizerPlugin = void 0;
 const piscina_1 = __importDefault(require("piscina"));
 const typescript_1 = require("typescript");
 const environment_options_1 = require("../../utils/environment-options");
+const esbuild_executor_1 = require("./esbuild-executor");
 /**
  * The maximum number of Workers that will be created to execute optimize tasks.
  */
@@ -105,6 +106,10 @@ class JavaScriptOptimizerPlugin {
                     target,
                     removeLicenses: this.options.removeLicenses,
                     advanced: this.options.advanced,
+                    // Perform a single native esbuild support check.
+                    // This removes the need for each worker to perform the check which would
+                    // otherwise require spawning a separate process per worker.
+                    alwaysUseWasm: !esbuild_executor_1.EsbuildExecutor.hasNativeSupport(),
                 };
                 // Sort scripts so larger scripts start first - worker pool uses a FIFO queue
                 scriptsToOptimize.sort((a, b) => a.code.length - b.code.length);

package/src/webpack/plugins/javascript-optimizer-worker.d.ts

@@ -13,22 +13,64 @@ interface OptimizeRequest {
      * The options to use when optimizing.
      */
     options: {
+        /**
+         * Controls advanced optimizations.
+         * Currently these are only terser related:
+         * * terser compress passes are set to 2
+         * * terser pure_getters option is enabled
+         */
         advanced: boolean;
+        /**
+         * Specifies the string tokens that should be replaced with a defined value.
+         */
         define?: Record<string, string>;
+        /**
+         * Controls whether class, function, and variable names should be left intact
+         * throughout the output code.
+         */
         keepNames: boolean;
+        /**
+         * Controls whether license text is removed from the output code.
+         * Within the CLI, this option is linked to the license extraction functionality.
+         */
         removeLicenses: boolean;
+        /**
+         * Controls whether source maps should be generated.
+         */
         sourcemap: boolean;
+        /**
+         * Specifies the target ECMAScript version for the output code.
+         */
         target: 5 | 2015 | 2016 | 2017 | 2018 | 2019 | 2020;
+        /**
+         * Controls whether esbuild should only use the WASM-variant instead of trying to
+         * use the native variant. Some platforms may not support the native-variant and
+         * this option allows one support test to be conducted prior to all the workers starting.
+         */
+        alwaysUseWasm: boolean;
     };
     /**
      * The JavaScript asset to optimize.
      */
     asset: {
+        /**
+         * The name of the JavaScript asset (typically the filename).
+         */
         name: string;
+        /**
+         * The source content of the JavaScript asset.
+         */
         code: string;
+        /**
+         * The source map of the JavaScript asset, if available.
+         * This map is merged with all intermediate source maps during optimization.
+         */
         map: object;
     };
 }
+/**
+ * Handles optimization requests sent from the main thread via the `JavaScriptOptimizerPlugin`.
+ */
 export default function ({ asset, options }: OptimizeRequest): Promise<{
     name: string;
     code: string;

package/src/webpack/plugins/javascript-optimizer-worker.js

@@ -11,21 +11,63 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 const remapping_1 = __importDefault(require("@ampproject/remapping"));
-const esbuild_1 = require("esbuild");
 const terser_1 = require("terser");
+const esbuild_executor_1 = require("./esbuild-executor");
+/**
+ * The cached esbuild executor.
+ * This will automatically use the native or WASM version based on platform and availability
+ * with the native version given priority due to its superior performance.
+ */
+let esbuild;
+/**
+ * Handles optimization requests sent from the main thread via the `JavaScriptOptimizerPlugin`.
+ */
 async function default_1({ asset, options }) {
-    var _a;
     // esbuild is used as a first pass
-    let esbuildResult;
+    const esbuildResult = await optimizeWithEsbuild(asset.code, asset.name, options);
+    // terser is used as a second pass
+    const terserResult = await optimizeWithTerser(asset.name, esbuildResult.code, options.sourcemap, options.target, options.advanced);
+    // Merge intermediate sourcemaps with input sourcemap if enabled
+    let fullSourcemap;
+    if (options.sourcemap) {
+        const partialSourcemaps = [];
+        if (esbuildResult.map) {
+            partialSourcemaps.unshift(JSON.parse(esbuildResult.map));
+        }
+        if (terserResult.map) {
+            partialSourcemaps.unshift(terserResult.map);
+        }
+        if (asset.map) {
+            partialSourcemaps.push(asset.map);
+        }
+        fullSourcemap = (0, remapping_1.default)(partialSourcemaps, () => null);
+    }
+    return { name: asset.name, code: terserResult.code, map: fullSourcemap };
+}
+exports.default = default_1;
+/**
+ * Optimizes a JavaScript asset using esbuild.
+ *
+ * @param content The JavaScript asset source content to optimize.
+ * @param name The name of the JavaScript asset. Used to generate source maps.
+ * @param options The optimization request options to apply to the content.
+ * @returns A promise that resolves with the optimized code, source map, and any warnings.
+ */
+async function optimizeWithEsbuild(content, name, options) {
+    var _a;
+    if (!esbuild) {
+        esbuild = new esbuild_executor_1.EsbuildExecutor(options.alwaysUseWasm);
+    }
+    let result;
     try {
-        esbuildResult = await esbuild_1.transform(asset.code, {
+        result = await esbuild.transform(content, {
             minifyIdentifiers: !options.keepNames,
             minifySyntax: true,
             // NOTE: Disabling whitespace ensures unused pure annotations are kept
             minifyWhitespace: false,
             pure: ['forwardRef'],
             legalComments: options.removeLicenses ? 'none' : 'inline',
-            sourcefile: asset.name,
+            sourcefile: name,
             sourcemap: options.sourcemap && 'external',
             define: options.define,
             keepNames: options.keepNames,
@@ -40,36 +82,30 @@ async function default_1({ asset, options }) {
         // this is and has been considered a configuration issue. Global scripts must be compatible with
         // the target environment.
         if ((_a = failure.errors) === null || _a === void 0 ? void 0 : _a.every((error) => error.text.includes('to the configured target environment ("es5") is not supported yet'))) {
-            esbuildResult = {
-                code: asset.code,
+            result = {
+                code: content,
+                map: '',
+                warnings: [],
             };
         }
         else {
             throw error;
         }
     }
-    // terser is used as a second pass
-    const terserResult = await optimizeWithTerser(asset.name, esbuildResult.code, options.sourcemap, options.target, options.advanced);
-    // Merge intermediate sourcemaps with input sourcemap if enabled
-    let fullSourcemap;
-    if (options.sourcemap) {
-        const partialSourcemaps = [];
-        if (esbuildResult.map) {
-            partialSourcemaps.unshift(JSON.parse(esbuildResult.map));
-        }
-        if (terserResult.map) {
-            partialSourcemaps.unshift(terserResult.map);
-        }
-        if (asset.map) {
-            partialSourcemaps.push(asset.map);
-        }
-        fullSourcemap = remapping_1.default(partialSourcemaps, () => null);
-    }
-    return { name: asset.name, code: terserResult.code, map: fullSourcemap };
+    return result;
 }
-exports.default = default_1;
+/**
+ * Optimizes a JavaScript asset using terser.
+ *
+ * @param name The name of the JavaScript asset. Used to generate source maps.
+ * @param code The JavaScript asset source content to optimize.
+ * @param sourcemaps If true, generate an output source map for the optimized code.
+ * @param target Specifies the target ECMAScript version for the output code.
+ * @param advanced Controls advanced optimizations.
+ * @returns A promise that resolves with the optimized code and source map.
+ */
 async function optimizeWithTerser(name, code, sourcemaps, target, advanced) {
-    const result = await terser_1.minify({ [name]: code }, {
+    const result = await (0, terser_1.minify)({ [name]: code }, {
         compress: {
             passes: advanced ? 2 : 1,
             pure_getters: advanced,

package/src/webpack/plugins/karma/karma.js

@@ -69,11 +69,11 @@ const init = (config, emitter) => {
             ` be used from within Angular CLI and will not work correctly outside of it.`);
     }
     const options = config.buildWebpack.options;
-    const logger = config.buildWebpack.logger || node_1.createConsoleLogger();
+    const logger = config.buildWebpack.logger || (0, node_1.createConsoleLogger)();
     successCb = config.buildWebpack.successCb;
     failureCb = config.buildWebpack.failureCb;
     // Add a reporter that fixes sourcemap urls.
-    if (index_1.normalizeSourceMaps(options.sourceMap).scripts) {
+    if ((0, index_1.normalizeSourceMaps)(options.sourceMap).scripts) {
         config.reporters.unshift('@angular-devkit/build-angular--sourcemap-reporter');
         // Code taken from https://github.com/tschaub/karma-source-map-support.
         // We can't use it directly because we need to add it conditionally in this file, and karma
@@ -124,7 +124,7 @@ const init = (config, emitter) => {
     // Files need to be served from a custom path for Karma.
     webpackConfig.output.path = `/${KARMA_APPLICATION_PATH}/`;
     webpackConfig.output.publicPath = `/${KARMA_APPLICATION_PATH}/`;
-    const compiler = webpack_1.default(webpackConfig, (error, stats) => {
+    const compiler = (0, webpack_1.default)(webpackConfig, (error, stats) => {
         var _a;
         if (error) {
             throw error;
@@ -137,7 +137,7 @@ const init = (config, emitter) => {
                 errors: true,
                 warnings: true,
             });
-            logger.error(stats_1.statsErrorsToString(statsJson, { colors: true }));
+            logger.error((0, stats_1.statsErrorsToString)(statsJson, { colors: true }));
             // Notify potential listeners of the compile error.
             emitter.emit('compile_error', {
                 errors: (_a = statsJson.errors) === null || _a === void 0 ? void 0 : _a.map((e) => e.message),

package/src/webpack/plugins/postcss-cli-resources.js

@@ -93,7 +93,7 @@ function default_1(options) {
                     reject(err);
                     return;
                 }
-                let outputPath = loader_utils_1.interpolateName({ resourcePath: result }, filename(result), {
+                let outputPath = (0, loader_utils_1.interpolateName)({ resourcePath: result }, filename(result), {
                     content,
                     context: loader.context || loader.rootContext,
                 }).replace(/\\|\//g, '-');

package/src/webpack/plugins/scripts-webpack-plugin.js

@@ -125,7 +125,7 @@ class ScriptsWebpackPlugin {
                     concatSource.add('\n;');
                 });
                 const combinedSource = new webpack_1.sources.CachedSource(concatSource);
-                const filename = loader_utils_1.interpolateName({ resourcePath: 'scripts.js' }, this.options.filename, {
+                const filename = (0, loader_utils_1.interpolateName)({ resourcePath: 'scripts.js' }, this.options.filename, {
                     content: combinedSource.source(),
                 });
                 const output = { filename, source: combinedSource };

package/src/webpack/plugins/single-test-transform.js

@@ -35,7 +35,7 @@ function loader(source) {
         return source;
     }
     const targettedImports = files
-        .map((path) => `require('./${path.replace('.' + path_1.extname(path), '')}');`)
+        .map((path) => `require('./${path.replace('.' + (0, path_1.extname)(path), '')}');`)
         .join('\n');
     const mockedRequireContext = 'Object.assign(() => { }, { keys: () => [], resolve: () => undefined });\n';
     source = source.replace(/require\.context\(.*/, mockedRequireContext + targettedImports);

package/src/webpack/utils/stats.js

@@ -103,9 +103,9 @@ function generateBuildStatsTable(data, colors, showTotalSize) {
     if (changedLazyChunksStats.length) {
         bundleInfo.push(['Lazy Chunk Files', 'Names', 'Size'].map(bold), ...changedLazyChunksStats);
     }
-    return text_table_1.default(bundleInfo, {
+    return (0, text_table_1.default)(bundleInfo, {
         hsep: dim(' | '),
-        stringLength: (s) => color_1.removeColor(s).length,
+        stringLength: (s) => (0, color_1.removeColor)(s).length,
         align: ['l', 'l', 'r'],
     });
 }
@@ -259,17 +259,17 @@ exports.statsHasWarnings = statsHasWarnings;
 function createWebpackLoggingCallback(options, logger) {
     const { verbose = false, scripts = [], styles = [] } = options;
     const extraEntryPoints = [
-        ...helpers_1.normalizeExtraEntryPoints(styles, 'styles'),
-        ...helpers_1.normalizeExtraEntryPoints(scripts, 'scripts'),
+        ...(0, helpers_1.normalizeExtraEntryPoints)(styles, 'styles'),
+        ...(0, helpers_1.normalizeExtraEntryPoints)(scripts, 'scripts'),
     ];
     return (stats, config) => {
         if (verbose) {
             logger.info(stats.toString(config.stats));
         }
-        const rawStats = stats.toJson(stats_1.getWebpackStatsConfig(false));
+        const rawStats = stats.toJson((0, stats_1.getWebpackStatsConfig)(false));
         const webpackStats = {
             ...rawStats,
-            chunks: async_chunks_1.markAsyncChunksNonInitial(rawStats, extraEntryPoints),
+            chunks: (0, async_chunks_1.markAsyncChunksNonInitial)(rawStats, extraEntryPoints),
         };
         webpackStatsLogger(logger, webpackStats, config);
     };