@angular-devkit/build-angular 12.2.7 → 12.2.11

package/package.json

@@ -1,16 +1,16 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "12.2.7",
+  "version": "12.2.11",
   "description": "Angular Webpack Build Facade",
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
     "@ampproject/remapping": "1.0.1",
-    "@angular-devkit/architect": "0.1202.7",
-    "@angular-devkit/build-optimizer": "0.1202.7",
-    "@angular-devkit/build-webpack": "0.1202.7",
-    "@angular-devkit/core": "12.2.7",
+    "@angular-devkit/architect": "0.1202.11",
+    "@angular-devkit/build-optimizer": "0.1202.11",
+    "@angular-devkit/build-webpack": "0.1202.11",
+    "@angular-devkit/core": "12.2.11",
     "@babel/core": "7.14.8",
     "@babel/generator": "7.14.8",
     "@babel/helper-annotate-as-pure": "7.14.5",
@@ -22,7 +22,7 @@
     "@babel/template": "7.14.5",
     "@discoveryjs/json-ext": "0.5.3",
     "@jsdevtools/coverage-istanbul-loader": "3.0.5",
-    "@ngtools/webpack": "12.2.7",
+    "@ngtools/webpack": "12.2.11",
     "ansi-colors": "4.1.1",
     "babel-loader": "8.2.2",
     "browserslist": "^4.9.1",
@@ -31,10 +31,10 @@
     "circular-dependency-plugin": "5.2.2",
     "copy-webpack-plugin": "9.0.1",
     "core-js": "3.16.0",
-    "critters": "0.0.10",
+    "critters": "0.0.11",
     "css-loader": "6.2.0",
     "css-minimizer-webpack-plugin": "3.0.2",
-    "esbuild-wasm": "0.12.29",
+    "esbuild-wasm": "0.13.8",
     "find-cache-dir": "3.3.1",
     "glob": "7.1.7",
     "https-proxy-agent": "5.0.0",
@@ -44,7 +44,7 @@
     "less-loader": "10.0.1",
     "license-webpack-plugin": "2.3.20",
     "loader-utils": "2.0.0",
-    "mini-css-extract-plugin": "2.2.1",
+    "mini-css-extract-plugin": "2.4.2",
     "minimatch": "3.0.4",
     "open": "8.2.1",
     "ora": "5.4.1",
@@ -77,7 +77,7 @@
     "webpack-subresource-integrity": "1.5.2"
   },
   "optionalDependencies": {
-    "esbuild": "0.12.29"
+    "esbuild": "0.13.8"
   },
   "peerDependencies": {
     "@angular/compiler-cli": "^12.0.0",
@@ -126,7 +126,7 @@
   },
   "engines": {
     "node": "^12.14.1 || >=14.0.0",
-    "npm": "^6.11.0 || ^7.5.6",
+    "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
     "yarn": ">= 1.13.0"
   },
   "author": "Angular Authors",

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

@@ -7,9 +7,7 @@
  */
 
 declare module 'babel-loader' {
-  type BabelLoaderCustomizer<T> = (
-    babel: typeof import('@babel/core'),
-  ) => {
+  type BabelLoaderCustomizer<T> = (babel: typeof import('@babel/core')) => {
     customOptions?(
       this: import('webpack').loader.LoaderContext,
       loaderOptions: Record<string, unknown>,
@@ -20,6 +18,17 @@ declare module 'babel-loader' {
       configuration: import('@babel/core').PartialConfig,
       loaderArguments: { source: string; map?: unknown; customOptions: T },
     ): import('@babel/core').TransformOptions;
+    result?(
+      this: import('webpack').loader.LoaderContext,
+      result: import('@babel/core').BabelFileResult,
+      context: {
+        source: string;
+        map?: unknown;
+        customOptions: T;
+        configuration: import('@babel/core').PartialConfig;
+        options: import('@babel/core').TransformOptions;
+      },
+    ): import('@babel/core').BabelFileResult;
   };
   function custom<T>(customizer: BabelLoaderCustomizer<T>): import('webpack').loader.Loader;
 }

package/src/babel/plugins/adjust-typescript-enums.js

@@ -68,9 +68,15 @@ function default_1() {
                 if (!enumCallee.isFunctionExpression() || enumCallee.node.params.length !== 1) {
                     return;
                 }
+                const enumCalleeParam = enumCallee.node.params[0];
+                const isEnumCalleeMatching = core_1.types.isIdentifier(enumCalleeParam) && enumCalleeParam.name === declarationId.name;
                 // Loose mode rewrites the enum to a shorter but less TypeScript-like form
+                // Note: We only can apply the `loose` mode transformation if the callee parameter matches
+                // with the declaration identifier name. This is necessary in case the the declaration id has
+                // been renamed to avoid collisions, as the loose transform would then break the enum assignments
+                // which rely on the differently-named callee identifier name.
                 let enumAssignments;
-                if (loose) {
+                if (loose && isEnumCalleeMatching) {
                     enumAssignments = [];
                 }
                 // Check if all enum member values are pure.

package/src/babel/webpack-loader.js

@@ -6,7 +6,11 @@
  * 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 __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+const remapping_1 = __importDefault(require("@ampproject/remapping"));
 const linker_1 = require("@angular/compiler-cli/linker");
 const babel_loader_1 = require("babel-loader");
 const typescript_1 = require("typescript");
@@ -118,10 +122,10 @@ exports.default = babel_loader_1.custom(() => {
             }
             return {
                 ...configuration.options,
-                // Workaround for https://github.com/babel/babel-loader/pull/896 is available
-                // Delete once the above PR is released
+                // Using `false` disables babel from attempting to locate sourcemaps or process any inline maps.
+                // The babel types do not include the false option even though it is valid
                 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-                inputSourceMap: configuration.options.inputSourceMap || false,
+                inputSourceMap: false,
                 plugins,
                 presets: [
                     ...(configuration.options.presets || []),
@@ -146,5 +150,22 @@ exports.default = babel_loader_1.custom(() => {
                 ],
             };
         },
+        result(result, { map: inputSourceMap }) {
+            if (result.map && inputSourceMap) {
+                // Merge the intermediate sourcemap generated by babel with the input source map.
+                // The casting is required due to slight differences in the types for babel and
+                // `@ampproject/remapping` source map objects but both are compatible with Webpack.
+                // This method for merging is used because it provides more accurate output
+                // and is faster while using less memory.
+                result.map = {
+                    // Convert the SourceMap back to simple plain object.
+                    // This is needed because otherwise code-coverage will fail with `don't know how to turn this value into a node`
+                    // Which is throw by Babel when it is invoked again from `istanbul-lib-instrument`.
+                    // https://github.com/babel/babel/blob/780aa48d2a34dc55f556843074b6aed45e7eabeb/packages/babel-types/src/converters/valueToNode.ts#L115-L130
+                    ...remapping_1.default([result.map, inputSourceMap], () => null),
+                };
+            }
+            return result;
+        },
     };
 });

package/src/browser/index.js

@@ -288,106 +288,110 @@ function buildWebpackBrowser(options, context, transforms = {}) {
                             processActions.push({ replacements: workerReplacements, ...action });
                         }
                     }
-                    const executor = new action_executor_1.BundleActionExecutor({ cachePath: cacheDownlevelPath, i18n }, options.subresourceIntegrity ? 'sha384' : undefined);
+                    const differentialLoadingExecutor = new action_executor_1.BundleActionExecutor({ cachePath: cacheDownlevelPath, i18n }, options.subresourceIntegrity ? 'sha384' : undefined);
                     // Execute the bundle processing actions
                     try {
                         spinner.start('Generating ES5 bundles for differential loading...');
-                        for await (const result of executor.processAll(processActions)) {
+                        for await (const result of differentialLoadingExecutor.processAll(processActions)) {
                             processResults.push(result);
                         }
-                        // Runtime must be processed after all other files
-                        if (processRuntimeAction) {
-                            const runtimeOptions = {
-                                ...processRuntimeAction,
-                                runtimeData: processResults,
-                                supportedBrowsers: buildBrowserFeatures.supportedBrowsers,
-                            };
-                            processResults.push(await Promise.resolve().then(() => __importStar(require('../utils/process-bundle'))).then((m) => m.process(runtimeOptions)));
-                        }
-                        spinner.succeed('ES5 bundle generation complete.');
-                        if (i18n.shouldInline) {
-                            spinner.start('Generating localized bundles...');
-                            const inlineActions = [];
-                            const processedFiles = new Set();
-                            for (const result of processResults) {
-                                if (result.original) {
-                                    inlineActions.push({
-                                        filename: path.basename(result.original.filename),
-                                        code: fs.readFileSync(result.original.filename, 'utf8'),
-                                        map: result.original.map &&
-                                            fs.readFileSync(result.original.map.filename, 'utf8'),
-                                        outputPath: baseOutputPath,
-                                        es5: false,
-                                        missingTranslation: options.i18nMissingTranslation,
-                                        setLocale: result.name === mainChunkId,
-                                    });
-                                    processedFiles.add(result.original.filename);
-                                    if (result.original.map) {
-                                        processedFiles.add(result.original.map.filename);
-                                    }
+                    }
+                    finally {
+                        differentialLoadingExecutor.stop();
+                    }
+                    // Runtime must be processed after all other files
+                    if (processRuntimeAction) {
+                        const runtimeOptions = {
+                            ...processRuntimeAction,
+                            runtimeData: processResults,
+                            supportedBrowsers: buildBrowserFeatures.supportedBrowsers,
+                        };
+                        processResults.push(await Promise.resolve().then(() => __importStar(require('../utils/process-bundle'))).then((m) => m.process(runtimeOptions)));
+                    }
+                    spinner.succeed('ES5 bundle generation complete.');
+                    if (i18n.shouldInline) {
+                        spinner.start('Generating localized bundles...');
+                        const inlineActions = [];
+                        const processedFiles = new Set();
+                        for (const result of processResults) {
+                            if (result.original) {
+                                inlineActions.push({
+                                    filename: path.basename(result.original.filename),
+                                    code: fs.readFileSync(result.original.filename, 'utf8'),
+                                    map: result.original.map &&
+                                        fs.readFileSync(result.original.map.filename, 'utf8'),
+                                    outputPath: baseOutputPath,
+                                    es5: false,
+                                    missingTranslation: options.i18nMissingTranslation,
+                                    setLocale: result.name === mainChunkId,
+                                });
+                                processedFiles.add(result.original.filename);
+                                if (result.original.map) {
+                                    processedFiles.add(result.original.map.filename);
                                 }
-                                if (result.downlevel) {
-                                    inlineActions.push({
-                                        filename: path.basename(result.downlevel.filename),
-                                        code: fs.readFileSync(result.downlevel.filename, 'utf8'),
-                                        map: result.downlevel.map &&
-                                            fs.readFileSync(result.downlevel.map.filename, 'utf8'),
-                                        outputPath: baseOutputPath,
-                                        es5: true,
-                                        missingTranslation: options.i18nMissingTranslation,
-                                        setLocale: result.name === mainChunkId,
-                                    });
-                                    processedFiles.add(result.downlevel.filename);
-                                    if (result.downlevel.map) {
-                                        processedFiles.add(result.downlevel.map.filename);
-                                    }
+                            }
+                            if (result.downlevel) {
+                                inlineActions.push({
+                                    filename: path.basename(result.downlevel.filename),
+                                    code: fs.readFileSync(result.downlevel.filename, 'utf8'),
+                                    map: result.downlevel.map &&
+                                        fs.readFileSync(result.downlevel.map.filename, 'utf8'),
+                                    outputPath: baseOutputPath,
+                                    es5: true,
+                                    missingTranslation: options.i18nMissingTranslation,
+                                    setLocale: result.name === mainChunkId,
+                                });
+                                processedFiles.add(result.downlevel.filename);
+                                if (result.downlevel.map) {
+                                    processedFiles.add(result.downlevel.map.filename);
                                 }
                             }
-                            let hasErrors = false;
-                            try {
-                                for await (const result of executor.inlineAll(inlineActions)) {
-                                    if (options.verbose) {
-                                        context.logger.info(`Localized "${result.file}" [${result.count} translation(s)].`);
+                        }
+                        let hasErrors = false;
+                        const i18nExecutor = new action_executor_1.BundleActionExecutor({ i18n }, options.subresourceIntegrity ? 'sha384' : undefined);
+                        try {
+                            for await (const result of i18nExecutor.inlineAll(inlineActions)) {
+                                if (options.verbose) {
+                                    context.logger.info(`Localized "${result.file}" [${result.count} translation(s)].`);
+                                }
+                                for (const diagnostic of result.diagnostics) {
+                                    spinner.stop();
+                                    if (diagnostic.type === 'error') {
+                                        hasErrors = true;
+                                        context.logger.error(diagnostic.message);
                                     }
-                                    for (const diagnostic of result.diagnostics) {
-                                        spinner.stop();
-                                        if (diagnostic.type === 'error') {
-                                            hasErrors = true;
-                                            context.logger.error(diagnostic.message);
-                                        }
-                                        else {
-                                            context.logger.warn(diagnostic.message);
-                                        }
-                                        spinner.start();
+                                    else {
+                                        context.logger.warn(diagnostic.message);
                                     }
+                                    spinner.start();
                                 }
-                                // Copy any non-processed files into the output locations
-                                await copy_assets_1.copyAssets([
-                                    {
-                                        glob: '**/*',
-                                        input: webpackOutputPath,
-                                        output: '',
-                                        ignore: [...processedFiles].map((f) => path.relative(webpackOutputPath, f)),
-                                    },
-                                ], Array.from(outputPaths.values()), '');
-                            }
-                            catch (err) {
-                                spinner.fail('Localized bundle generation failed.');
-                                return { success: false, error: mapErrorToMessage(err) };
-                            }
-                            if (hasErrors) {
-                                spinner.fail('Localized bundle generation failed.');
-                            }
-                            else {
-                                spinner.succeed('Localized bundle generation complete.');
-                            }
-                            if (hasErrors) {
-                                return { success: false };
                             }
+                            // Copy any non-processed files into the output locations
+                            await copy_assets_1.copyAssets([
+                                {
+                                    glob: '**/*',
+                                    input: webpackOutputPath,
+                                    output: '',
+                                    ignore: [...processedFiles].map((f) => path.relative(webpackOutputPath, f)),
+                                },
+                            ], Array.from(outputPaths.values()), '');
+                        }
+                        catch (err) {
+                            spinner.fail('Localized bundle generation failed.');
+                            return { success: false, error: mapErrorToMessage(err) };
+                        }
+                        finally {
+                            i18nExecutor.stop();
+                        }
+                        if (hasErrors) {
+                            spinner.fail('Localized bundle generation failed.');
+                        }
+                        else {
+                            spinner.succeed('Localized bundle generation complete.');
+                        }
+                        if (hasErrors) {
+                            return { success: false };
                         }
-                    }
-                    finally {
-                        executor.stop();
                     }
                     for (const result of processResults) {
                         const chunk = (_a = webpackStats.chunks) === null || _a === void 0 ? void 0 : _a.find((chunk) => { var _a; return ((_a = chunk.id) === null || _a === void 0 ? void 0 : _a.toString()) === result.name; });

package/src/dev-server/index.js

@@ -274,6 +274,9 @@ function serveWebpackBrowser(options, context, transforms = {}) {
             if (buildEvent.success) {
                 logger.info(`\n${color_1.colors.greenBright(color_1.colors.symbols.check)} Compiled successfully.`);
             }
+            else {
+                logger.info(`\n${color_1.colors.redBright(color_1.colors.symbols.cross)} Failed to compile.`);
+            }
             return { ...buildEvent, baseUrl: serverAddress };
         }));
     }));

package/src/webpack/configs/browser.js

@@ -37,6 +37,7 @@ function getBrowserConfig(wco) {
         devtool: false,
         resolve: {
             mainFields: ['es2015', 'browser', 'module', 'main'],
+            conditionNames: ['es2015', '...'],
         },
         output: {
             crossOriginLoading,

package/src/webpack/configs/common.js

@@ -386,7 +386,7 @@ function getCommonConfig(wco) {
                     test: /\.[cm]?js$|\.tsx?$/,
                     // The below is needed due to a bug in `@babel/runtime`. See: https://github.com/babel/babel/issues/12824
                     resolve: { fullySpecified: false },
-                    exclude: [/[\/\\](?:core-js|\@babel|tslib|web-animations-js)[\/\\]/],
+                    exclude: [/[/\\](?:core-js|@babel|tslib|web-animations-js|web-streams-polyfill)[/\\]/],
                     use: [
                         {
                             loader: require.resolve('../../babel/webpack-loader'),

package/src/webpack/configs/test.js

@@ -61,6 +61,7 @@ function getTestConfig(wco) {
         target: wco.tsConfig.options.target === typescript_1.ScriptTarget.ES5 ? ['web', 'es5'] : 'web',
         resolve: {
             mainFields: ['es2015', 'browser', 'module', 'main'],
+            conditionNames: ['es2015', '...'],
         },
         devtool: false,
         entry: {