@angular-devkit/build-angular 0.803.19 → 0.803.23

package/package.json

@@ -1,32 +1,32 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "0.803.19",
+  "version": "0.803.23",
   "description": "Angular Webpack Build Facade",
   "experimental": true,
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
-    "@angular-devkit/architect": "0.803.19",
-    "@angular-devkit/build-optimizer": "0.803.19",
-    "@angular-devkit/build-webpack": "0.803.19",
-    "@angular-devkit/core": "8.3.19",
-    "@babel/core": "7.5.5",
-    "@babel/preset-env": "7.5.5",
-    "@ngtools/webpack": "8.3.19",
+    "@angular-devkit/architect": "0.803.23",
+    "@angular-devkit/build-optimizer": "0.803.23",
+    "@angular-devkit/build-webpack": "0.803.23",
+    "@angular-devkit/core": "8.3.23",
+    "@babel/core": "7.7.5",
+    "@babel/preset-env": "7.7.6",
+    "@ngtools/webpack": "8.3.23",
     "ajv": "6.10.2",
     "autoprefixer": "9.6.1",
-    "browserslist": "4.6.6",
+    "browserslist": "4.8.3",
     "cacache": "12.0.2",
-    "caniuse-lite": "1.0.30000989",
+    "caniuse-lite": "1.0.30001019",
     "circular-dependency-plugin": "5.2.0",
     "clean-css": "4.2.1",
-    "copy-webpack-plugin": "5.0.4",
+    "coverage-istanbul-loader": "2.0.3",
+    "copy-webpack-plugin": "5.1.1",
     "core-js": "3.2.1",
     "file-loader": "4.2.0",
     "find-cache-dir": "3.0.0",
     "glob": "7.1.4",
-    "istanbul-instrumenter-loader": "3.0.1",
     "jest-worker": "24.9.0",
     "karma-source-map-support": "1.4.0",
     "less": "3.9.0",
@@ -53,9 +53,9 @@
     "style-loader": "1.0.0",
     "stylus": "0.54.5",
     "stylus-loader": "3.0.2",
-    "tree-kill": "1.2.1",
+    "tree-kill": "1.2.2",
     "terser": "4.3.9",
-    "terser-webpack-plugin": "1.4.1",
+    "terser-webpack-plugin": "1.4.3",
     "webpack": "4.39.2",
     "webpack-dev-middleware": "3.7.2",
     "webpack-dev-server": "3.9.0",

package/src/angular-cli-files/models/build-options.d.ts

@@ -81,4 +81,5 @@ export interface WebpackConfigOptions<T = BuildOptions> {
     tsConfig: ParsedConfiguration;
     tsConfigPath: string;
     supportES2015: boolean;
+    differentialLoadingMode?: boolean;
 }

package/src/angular-cli-files/models/webpack-configs/browser.js

@@ -40,7 +40,7 @@ function getBrowserConfig(wco) {
         }));
     }
     if (!isEval && (scriptsSourceMap || stylesSourceMap)) {
-        extraPlugins.push(utils_1.getSourceMapDevTool(!!scriptsSourceMap, !!stylesSourceMap, hiddenSourceMap));
+        extraPlugins.push(utils_1.getSourceMapDevTool(!!scriptsSourceMap, !!stylesSourceMap, wco.differentialLoadingMode ? true : hiddenSourceMap));
     }
     const globalStylesBundleNames = utils_1.normalizeExtraEntryPoints(buildOptions.styles, 'styles')
         .map(style => style.bundleName);

package/src/angular-cli-files/models/webpack-configs/test.js

@@ -21,7 +21,6 @@ function getTestConfig(wco) {
     const { root, buildOptions, sourceRoot: include } = wco;
     const extraRules = [];
     const extraPlugins = [];
-    // if (buildOptions.codeCoverage && CliConfig.fromProject()) {
     if (buildOptions.codeCoverage) {
         const codeCoverageExclude = buildOptions.codeCoverageExclude;
         const exclude = [
@@ -37,8 +36,8 @@ function getTestConfig(wco) {
             });
         }
         extraRules.push({
-            test: /\.(js|ts)$/,
-            loader: 'istanbul-instrumenter-loader',
+            test: /\.(jsx?|tsx?)$/,
+            loader: require.resolve('coverage-istanbul-loader'),
             options: { esModules: true },
             enforce: 'post',
             exclude,

package/src/angular-cli-files/utilities/stats.js

@@ -66,11 +66,19 @@ function statsToString(json, statsConfig) {
     }
 }
 exports.statsToString = statsToString;
+// TODO(#16193): Don't emit this warning in the first place rather than just suppressing it.
+const ERRONEOUS_WARNINGS = [
+    /multiple assets emit different content.*3rdpartylicenses\.txt/i,
+];
 function statsWarningsToString(json, statsConfig) {
     const colors = statsConfig.colors;
     const rs = (x) => colors ? reset(x) : x;
     const y = (x) => colors ? bold(yellow(x)) : x;
-    return rs('\n' + json.warnings.map((warning) => y(`WARNING in ${warning}`)).join('\n\n'));
+    return rs('\n' + json.warnings
+        .map((warning) => `${warning}`)
+        .filter((warning) => !ERRONEOUS_WARNINGS.some((erroneous) => erroneous.test(warning)))
+        .map((warning) => y(`WARNING in ${warning}`))
+        .join('\n\n'));
 }
 exports.statsWarningsToString = statsWarningsToString;
 function statsErrorsToString(json, statsConfig) {

package/src/browser/action-cache.d.ts

@@ -12,6 +12,6 @@ export declare class BundleActionCache {
     static copyEntryContent(entry: CacheEntry | string, dest: fs.PathLike): void;
     generateBaseCacheKey(content: string): string;
     generateCacheKeys(action: ProcessBundleOptions): string[];
-    getCacheEntries(cacheKeys: (string | null)[]): Promise<(CacheEntry | null)[] | false>;
+    getCacheEntries(cacheKeys: (string | undefined)[]): Promise<(CacheEntry | null)[] | false>;
     getCachedBundleResult(action: ProcessBundleOptions): Promise<ProcessBundleResult | null>;
 }

package/src/browser/action-cache.js

@@ -56,26 +56,30 @@ class BundleActionCache {
         return baseCacheKey;
     }
     generateCacheKeys(action) {
-        const baseCacheKey = this.generateBaseCacheKey(action.code);
-        // Postfix added to sourcemap cache keys when vendor sourcemaps are present
+        // Postfix added to sourcemap cache keys when vendor, hidden sourcemaps are present
         // Allows non-destructive caching of both variants
-        const SourceMapVendorPostfix = !!action.sourceMaps && action.vendorSourceMaps ? '|vendor' : '';
+        const sourceMapVendorPostfix = action.sourceMaps && action.vendorSourceMaps ? '|vendor' : '';
+        // sourceMappingURL is added at the very end which causes the code to be the same when sourcemaps are enabled/disabled
+        // When using hiddenSourceMaps we can omit the postfix since sourceMappingURL will not be added.
+        // When having sourcemaps a hashed file and non hashed file can have the same content. But the sourceMappingURL will differ.
+        const sourceMapPostFix = action.sourceMaps && !action.hiddenSourceMaps ? `|sourcemap|${action.filename}` : '';
+        const baseCacheKey = this.generateBaseCacheKey(action.code);
         // Determine cache entries required based on build settings
         const cacheKeys = [];
         // If optimizing and the original is not ignored, add original as required
-        if ((action.optimize || action.optimizeOnly) && !action.ignoreOriginal) {
-            cacheKeys[0 /* OriginalCode */] = baseCacheKey + '|orig';
+        if (!action.ignoreOriginal) {
+            cacheKeys[0 /* OriginalCode */] = baseCacheKey + sourceMapPostFix + '|orig';
             // If sourcemaps are enabled, add original sourcemap as required
             if (action.sourceMaps) {
-                cacheKeys[1 /* OriginalMap */] = baseCacheKey + SourceMapVendorPostfix + '|orig-map';
+                cacheKeys[1 /* OriginalMap */] = baseCacheKey + sourceMapVendorPostfix + '|orig-map';
             }
         }
         // If not only optimizing, add downlevel as required
         if (!action.optimizeOnly) {
-            cacheKeys[2 /* DownlevelCode */] = baseCacheKey + '|dl';
+            cacheKeys[2 /* DownlevelCode */] = baseCacheKey + sourceMapPostFix + '|dl';
             // If sourcemaps are enabled, add downlevel sourcemap as required
             if (action.sourceMaps) {
-                cacheKeys[3 /* DownlevelMap */] = baseCacheKey + SourceMapVendorPostfix + '|dl-map';
+                cacheKeys[3 /* DownlevelMap */] = baseCacheKey + sourceMapVendorPostfix + '|dl-map';
             }
         }
         return cacheKeys;
@@ -140,7 +144,7 @@ class BundleActionCache {
         cacheEntry = entries[2 /* DownlevelCode */];
         if (cacheEntry) {
             result.downlevel = {
-                filename: action.filename.replace('es2015', 'es5'),
+                filename: action.filename.replace(/\-es20\d{2}/, '-es5'),
                 size: cacheEntry.size,
                 integrity: cacheEntry.integrity,
             };
@@ -148,7 +152,7 @@ class BundleActionCache {
             cacheEntry = entries[3 /* DownlevelMap */];
             if (cacheEntry) {
                 result.downlevel.map = {
-                    filename: action.filename.replace('es2015', 'es5') + '.map',
+                    filename: action.filename.replace(/\-es20\d{2}/, '-es5') + '.map',
                     size: cacheEntry.size,
                 };
                 BundleActionCache.copyEntryContent(cacheEntry, result.downlevel.filename + '.map');

package/src/browser/index.js

@@ -212,12 +212,6 @@ function buildWebpackBrowser(options, context, transforms = {}) {
                         if (!es5Polyfills) {
                             moduleFiles.push(file);
                         }
-                        // If not optimizing then ES2015 polyfills do not need processing
-                        // Unlike other module scripts, it is never downleveled
-                        const es2015Polyfills = file.file.startsWith('polyfills-es2015');
-                        if (!actionOptions.optimize && es2015Polyfills) {
-                            continue;
-                        }
                         // Retrieve the content/map for the file
                         // NOTE: Additional future optimizations will read directly from memory
                         let filename = path.resolve(core_1.getSystemPath(root), options.outputPath, file.file);
@@ -234,8 +228,9 @@ function buildWebpackBrowser(options, context, transforms = {}) {
                         }
                         if (es5Polyfills) {
                             fs.unlinkSync(filename);
-                            filename = filename.replace('-es2015', '');
+                            filename = filename.replace(/\-es20\d{2}/, '');
                         }
+                        const es2015Polyfills = file.file.startsWith('polyfills-es20');
                         // Record the bundle processing action
                         // The runtime chunk gets special processing for lazy loaded files
                         actions.push({
@@ -256,8 +251,8 @@ function buildWebpackBrowser(options, context, transforms = {}) {
                         }
                         // Add the newly created ES5 bundles to the index as nomodule scripts
                         const newFilename = es5Polyfills
-                            ? file.file.replace('-es2015', '')
-                            : file.file.replace('es2015', 'es5');
+                            ? file.file.replace(/\-es20\d{2}/, '')
+                            : file.file.replace(/\-es20\d{2}/, '-es5');
                         noModuleFiles.push({ ...file, file: newFilename });
                     }
                     // Execute the bundle processing actions

package/src/dev-server/index.js

@@ -323,10 +323,6 @@ function _addLiveReload(options, browserOptions, webpackConfig, clientAddress, l
     if (clientAddress.pathname) {
         clientAddress.pathname = path.posix.join(clientAddress.pathname, 'sockjs-node');
         sockjsPath = '&sockPath=' + clientAddress.pathname;
-        // ensure webpack-dev-server uses the correct path to connect to the reloading socket
-        if (webpackConfig.devServer) {
-            webpackConfig.devServer.sockPath = clientAddress.pathname;
-        }
     }
     const entryPoints = [`${webpackDevServerPath}?${url.format(clientAddress)}${sockjsPath}`];
     if (options.hmr) {

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

@@ -10,7 +10,7 @@ export interface ProcessBundleOptions {
     optimize?: boolean;
     optimizeOnly?: boolean;
     ignoreOriginal?: boolean;
-    cacheKeys?: (string | null)[];
+    cacheKeys?: (string | undefined)[];
     integrityAlgorithm?: 'sha256' | 'sha384' | 'sha512';
     runtimeData?: ProcessBundleResult[];
 }

package/src/utils/process-bundle.js

@@ -7,13 +7,12 @@ Object.defineProperty(exports, "__esModule", { value: true });
  * 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
  */
+const core_1 = require("@babel/core");
 const crypto_1 = require("crypto");
 const fs = require("fs");
 const path = require("path");
 const source_map_1 = require("source-map");
 const terser_1 = require("terser");
-const typescript_1 = require("typescript");
-const webpack_sources_1 = require("webpack-sources");
 const mangle_options_1 = require("./mangle-options");
 const cacache = require('cacache');
 let cachePath;
@@ -23,7 +22,7 @@ function setup(options) {
 exports.setup = setup;
 async function cachePut(content, key, integrity) {
     if (cachePath && key) {
-        await cacache.put(cachePath, key, content, {
+        await cacache.put(cachePath, key || null, content, {
             metadata: { integrity },
         });
     }
@@ -43,69 +42,65 @@ async function process(options) {
     }
     const basePath = path.dirname(options.filename);
     const filename = path.basename(options.filename);
-    const downlevelFilename = filename.replace('es2015', 'es5');
+    const downlevelFilename = filename.replace(/\-es20\d{2}/, '-es5');
     const downlevel = !options.optimizeOnly;
     // if code size is larger than 1 MB, manually handle sourcemaps with newer source-map package.
     const codeSize = Buffer.byteLength(options.code);
     const mapSize = options.map ? Buffer.byteLength(options.map) : 0;
-    const manualSourceMaps = codeSize >= 1024 * 1024 || mapSize >= 1024 * 1024;
+    const manualSourceMaps = codeSize >= 500 * 1024 || mapSize >= 500 * 1024;
     const sourceCode = options.code;
-    const sourceMap = options.map ? JSON.parse(options.map) : undefined;
+    const sourceMap = options.map ? JSON.parse(options.map) : false;
     let downlevelCode;
     let downlevelMap;
     if (downlevel) {
         // Downlevel the bundle
-        const transformResult = typescript_1.transpileModule(sourceCode, {
-            fileName: downlevelFilename,
-            compilerOptions: {
-                sourceMap: !!sourceMap,
-                target: typescript_1.ScriptTarget.ES5,
-            },
+        const transformResult = await core_1.transformAsync(sourceCode, {
+            filename: options.filename,
+            // using false ensures that babel will NOT search and process sourcemap comments (large memory usage)
+            inputSourceMap: manualSourceMaps ? false : sourceMap,
+            babelrc: false,
+            presets: [
+                [
+                    require.resolve('@babel/preset-env'),
+                    {
+                        // modules aren't needed since the bundles use webpack's custom module loading
+                        modules: false,
+                        // 'transform-typeof-symbol' generates slower code
+                        exclude: ['transform-typeof-symbol'],
+                    },
+                ],
+            ],
+            minified: options.optimize,
+            // `false` ensures it is disabled and prevents large file warnings
+            compact: options.optimize || false,
+            sourceMaps: !!sourceMap,
         });
-        downlevelCode = transformResult.outputText;
-        if (sourceMap && transformResult.sourceMapText) {
-            if (manualSourceMaps) {
-                downlevelMap = await mergeSourcemaps(sourceMap, JSON.parse(transformResult.sourceMapText));
-            }
-            else {
-                // More accurate but significantly more costly
-                const tempSource = new webpack_sources_1.SourceMapSource(transformResult.outputText, downlevelFilename, JSON.parse(transformResult.sourceMapText), sourceCode, sourceMap);
-                downlevelMap = tempSource.map();
-            }
+        if (!transformResult || !transformResult.code) {
+            throw new Error(`Unknown error occurred processing bundle for "${options.filename}".`);
         }
-    }
-    if (options.optimize) {
-        if (downlevelCode) {
-            const minifyResult = terserMangle(downlevelCode, {
-                filename: downlevelFilename,
-                map: downlevelMap,
-                compress: true,
-            });
-            downlevelCode = minifyResult.code;
-            downlevelMap = minifyResult.map;
+        downlevelCode = transformResult.code;
+        if (manualSourceMaps && sourceMap && transformResult.map) {
+            downlevelMap = await mergeSourcemaps(sourceMap, transformResult.map);
         }
-        if (!options.ignoreOriginal) {
-            result.original = await mangleOriginal(options);
+        else {
+            // undefined is needed here to normalize the property type
+            downlevelMap = transformResult.map || undefined;
         }
     }
     if (downlevelCode) {
-        const downlevelPath = path.join(basePath, downlevelFilename);
-        let mapContent;
-        if (downlevelMap) {
-            if (!options.hiddenSourceMaps) {
-                downlevelCode += `\n//# sourceMappingURL=${downlevelFilename}.map`;
-            }
-            mapContent = JSON.stringify(downlevelMap);
-            await cachePut(mapContent, options.cacheKeys[3 /* DownlevelMap */]);
-            fs.writeFileSync(downlevelPath + '.map', mapContent);
-        }
-        result.downlevel = createFileEntry(downlevelFilename, downlevelCode, mapContent, options.integrityAlgorithm);
-        await cachePut(downlevelCode, options.cacheKeys[2 /* DownlevelCode */], result.downlevel.integrity);
-        fs.writeFileSync(downlevelPath, downlevelCode);
+        result.downlevel = await processBundle({
+            ...options,
+            code: downlevelCode,
+            map: downlevelMap,
+            filename: path.join(basePath, downlevelFilename),
+            isOriginal: false,
+        });
     }
-    // If original was not processed, add info
     if (!result.original && !options.ignoreOriginal) {
-        result.original = createFileEntry(options.filename, options.code, options.map, options.integrityAlgorithm);
+        result.original = await processBundle({
+            ...options,
+            isOriginal: true,
+        });
     }
     return result;
 }
@@ -154,24 +149,40 @@ async function mergeSourcemaps(first, second) {
     }
     return map;
 }
-async function mangleOriginal(options) {
-    const result = terserMangle(options.code, {
-        filename: path.basename(options.filename),
-        map: options.map ? JSON.parse(options.map) : undefined,
-        ecma: 6,
-    });
+async function processBundle(options) {
+    const { optimize, isOriginal, code, map, filename: filepath, hiddenSourceMaps, cacheKeys = [], integrityAlgorithm, } = options;
+    const rawMap = typeof map === 'string' ? JSON.parse(map) : map;
+    const filename = path.basename(filepath);
+    let result;
+    if (optimize) {
+        result = terserMangle(code, {
+            filename,
+            map: rawMap,
+            compress: !isOriginal,
+            ecma: isOriginal ? 6 : 5,
+        });
+    }
+    else {
+        if (rawMap) {
+            rawMap.file = filename;
+        }
+        result = {
+            map: rawMap,
+            code,
+        };
+    }
     let mapContent;
     if (result.map) {
-        if (!options.hiddenSourceMaps) {
-            result.code += `\n//# sourceMappingURL=${path.basename(options.filename)}.map`;
+        if (!hiddenSourceMaps) {
+            result.code += `\n//# sourceMappingURL=${filename}.map`;
         }
         mapContent = JSON.stringify(result.map);
-        await cachePut(mapContent, (options.cacheKeys && options.cacheKeys[1 /* OriginalMap */]) || null);
-        fs.writeFileSync(options.filename + '.map', mapContent);
+        await cachePut(mapContent, cacheKeys[isOriginal ? 1 /* OriginalMap */ : 3 /* DownlevelMap */]);
+        fs.writeFileSync(filepath + '.map', mapContent);
     }
-    const fileResult = createFileEntry(options.filename, result.code, mapContent, options.integrityAlgorithm);
-    await cachePut(result.code, (options.cacheKeys && options.cacheKeys[0 /* OriginalCode */]) || null, fileResult.integrity);
-    fs.writeFileSync(options.filename, result.code);
+    const fileResult = createFileEntry(filepath, result.code, mapContent, integrityAlgorithm);
+    await cachePut(result.code, cacheKeys[isOriginal ? 0 /* OriginalCode */ : 2 /* DownlevelCode */], fileResult.integrity);
+    fs.writeFileSync(filepath, result.code);
     return fileResult;
 }
 function terserMangle(code, options = {}) {
@@ -244,39 +255,18 @@ async function processRuntime(options) {
     }
     // Adjust lazy loaded scripts to point to the proper variant
     // Extra spacing is intentional to align source line positions
-    downlevelCode = downlevelCode.replace('"-es2015.', '   "-es5.');
-    const downlevelFilePath = options.filename.replace('es2015', 'es5');
-    let downlevelMap;
-    let result;
-    if (options.optimize) {
-        const minifiyResults = terserMangle(downlevelCode, {
-            filename: path.basename(downlevelFilePath),
-            map: options.map === undefined ? undefined : JSON.parse(options.map),
-        });
-        downlevelCode = minifiyResults.code;
-        downlevelMap = JSON.stringify(minifiyResults.map);
-        result = {
-            original: await mangleOriginal({ ...options, code: originalCode }),
-            downlevel: createFileEntry(downlevelFilePath, downlevelCode, downlevelMap, options.integrityAlgorithm),
-        };
-    }
-    else {
-        if (options.map) {
-            const rawMap = JSON.parse(options.map);
-            rawMap.file = path.basename(downlevelFilePath);
-            downlevelMap = JSON.stringify(rawMap);
-        }
-        result = {
-            original: createFileEntry(options.filename, originalCode, options.map, options.integrityAlgorithm),
-            downlevel: createFileEntry(downlevelFilePath, downlevelCode, downlevelMap, options.integrityAlgorithm),
-        };
-    }
-    if (downlevelMap) {
-        await cachePut(downlevelMap, (options.cacheKeys && options.cacheKeys[3 /* DownlevelMap */]) || null);
-        fs.writeFileSync(downlevelFilePath + '.map', downlevelMap);
-        downlevelCode += `\n//# sourceMappingURL=${path.basename(downlevelFilePath)}.map`;
-    }
-    await cachePut(downlevelCode, (options.cacheKeys && options.cacheKeys[2 /* DownlevelCode */]) || null);
-    fs.writeFileSync(downlevelFilePath, downlevelCode);
-    return result;
+    downlevelCode = downlevelCode.replace(/"\-es20\d{2}\./, '   "-es5.');
+    return {
+        original: await processBundle({
+            ...options,
+            code: originalCode,
+            isOriginal: true,
+        }),
+        downlevel: await processBundle({
+            ...options,
+            code: downlevelCode,
+            filename: options.filename.replace(/\-es20\d{2}/, '-es5'),
+            isOriginal: false,
+        }),
+    };
 }

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

@@ -63,6 +63,7 @@ async function generateWebpackConfig(context, workspaceRoot, projectRoot, source
             tsConfig,
             tsConfigPath,
             supportES2015,
+            differentialLoadingMode: differentialLoading && !utils_1.fullDifferential,
         };
         wco.buildOptions.progress = utils_1.defaultProgress(wco.buildOptions.progress);
         const partials = webpackPartialGenerator(wco);