@angular-devkit/build-angular 0.800.2 → 0.800.3

package/package.json

@@ -1,21 +1,21 @@
 {
   "name": "@angular-devkit/build-angular",
-  "version": "0.800.2",
+  "version": "0.800.3",
   "description": "Angular Webpack Build Facade",
   "experimental": true,
   "main": "src/index.js",
   "typings": "src/index.d.ts",
   "builders": "builders.json",
   "dependencies": {
-    "@angular-devkit/architect": "0.800.2",
-    "@angular-devkit/build-optimizer": "0.800.2",
-    "@angular-devkit/build-webpack": "0.800.2",
-    "@angular-devkit/core": "8.0.2",
-    "@ngtools/webpack": "8.0.2",
+    "@angular-devkit/architect": "0.800.3",
+    "@angular-devkit/build-optimizer": "0.800.3",
+    "@angular-devkit/build-webpack": "0.800.3",
+    "@angular-devkit/core": "8.0.3",
+    "@ngtools/webpack": "8.0.3",
     "ajv": "6.10.0",
     "autoprefixer": "9.5.1",
     "browserslist": "4.5.5",
-    "caniuse-api": "3.0.0",
+    "caniuse-lite": "1.0.30000974",
     "circular-dependency-plugin": "5.0.2",
     "clean-css": "4.2.1",
     "copy-webpack-plugin": "5.0.2",

package/src/angular-cli-files/models/safari-nomodule.js

@@ -1,22 +1,8 @@
-/**
- * Safari 10.1 supports modules, but does not support the `nomodule` attribute - it will
- * load <script nomodule> anyway. This snippet solve this problem, but only for script
- * tags that load external code, e.g.: <script nomodule src="nomodule.js"></script>
- *
- * Again: this will **not** prevent inline script, e.g.:
- * <script nomodule>alert('no modules');</script>.
- *
- * This workaround is possible because Safari supports the non-standard 'beforeload' event.
- * This allows us to trap the module and nomodule load.
- *
- * Note also that `nomodule` is supported in later versions of Safari - it's just 10.1 that
- * omits this attribute.
- */
-(function() {
+(function () {
   var check = document.createElement('script');
   if (!('noModule' in check) && 'onbeforeload' in check) {
     var support = false;
-    document.addEventListener('beforeload', function(e) {
+    document.addEventListener('beforeload', function (e) {
       if (e.target === check) {
         support = true;
       } else if (!e.target.hasAttribute('nomodule') || !support) {
@@ -30,4 +16,4 @@
     document.head.appendChild(check);
     check.remove();
   }
-}());
+}());

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

@@ -12,7 +12,7 @@ const CopyWebpackPlugin = require("copy-webpack-plugin");
 const path = require("path");
 const typescript_1 = require("typescript");
 const webpack_1 = require("webpack");
-const differential_loading_1 = require("../../../utils/differential-loading");
+const build_browser_features_1 = require("../../../utils/build-browser-features");
 const bundle_budget_1 = require("../../plugins/bundle-budget");
 const cleancss_webpack_plugin_1 = require("../../plugins/cleancss-webpack-plugin");
 const named_chunks_plugin_1 = require("../../plugins/named-chunks-plugin");
@@ -31,7 +31,7 @@ exports.buildOptimizerLoader = g['_DevKitIsLocal']
     : '@angular-devkit/build-optimizer/webpack-loader';
 // tslint:disable-next-line:no-big-function
 function getCommonConfig(wco) {
-    const { root, projectRoot, buildOptions } = wco;
+    const { root, projectRoot, buildOptions, tsConfig } = wco;
     const { styles: stylesOptimization, scripts: scriptsOptimization } = buildOptions.optimization;
     const { styles: stylesSourceMap, scripts: scriptsSourceMap, vendor: vendorSourceMap, } = buildOptions.sourceMap;
     const nodeModules = find_up_1.findUp('node_modules', projectRoot);
@@ -46,27 +46,31 @@ function getCommonConfig(wco) {
         entryPoints['main'] = [path.resolve(root, buildOptions.main)];
     }
     if (wco.buildOptions.platform !== 'server') {
-        const es5Polyfills = path.join(__dirname, '..', 'es5-polyfills.js');
-        const es5JitPolyfills = path.join(__dirname, '..', 'es5-jit-polyfills.js');
-        if (targetInFileName) {
-            // For differential loading we don't need to have 2 polyfill bundles
-            if (buildOptions.scriptTargetOverride === typescript_1.ScriptTarget.ES2015) {
-                entryPoints['polyfills'] = [path.join(__dirname, '..', 'safari-nomodule.js')];
-            }
-            else {
-                entryPoints['polyfills'] = [es5Polyfills];
-                if (!buildOptions.aot) {
-                    entryPoints['polyfills'].push(es5JitPolyfills);
+        const buildBrowserFeatures = new build_browser_features_1.BuildBrowserFeatures(projectRoot, tsConfig.options.target || typescript_1.ScriptTarget.ES5);
+        if ((buildOptions.scriptTargetOverride || tsConfig.options.target) === typescript_1.ScriptTarget.ES5) {
+            if (buildOptions.es5BrowserSupport ||
+                (buildOptions.es5BrowserSupport === undefined &&
+                    buildBrowserFeatures.isEs5SupportNeeded())) {
+                // The nomodule polyfill needs to be inject prior to any script and be
+                // outside of webpack compilation because otherwise webpack will cause the
+                // script to be wrapped in window["webpackJsonp"] which causes this to fail.
+                if (buildBrowserFeatures.isNoModulePolyfillNeeded()) {
+                    const noModuleScript = {
+                        bundleName: 'polyfills-nomodule-es5',
+                        input: path.join(__dirname, '..', 'safari-nomodule.js'),
+                    };
+                    buildOptions.scripts = buildOptions.scripts
+                        ? [...buildOptions.scripts, noModuleScript]
+                        : [noModuleScript];
                 }
-            }
-        }
-        else {
-            // For NON differential loading we want to have 2 polyfill bundles
-            if (buildOptions.es5BrowserSupport
-                || (buildOptions.es5BrowserSupport === undefined && differential_loading_1.isEs5SupportNeeded(projectRoot))) {
-                entryPoints['polyfills-es5'] = [es5Polyfills];
+                // For differential loading we don't need to generate a seperate polyfill file
+                // because they will be loaded exclusivly based on module and nomodule
+                const polyfillsChunkName = buildBrowserFeatures.isDifferentialLoadingNeeded()
+                    ? 'polyfills'
+                    : 'polyfills-es5';
+                entryPoints[polyfillsChunkName] = [path.join(__dirname, '..', 'es5-polyfills.js')];
                 if (!buildOptions.aot) {
-                    entryPoints['polyfills-es5'].push(es5JitPolyfills);
+                    entryPoints[polyfillsChunkName].push(path.join(__dirname, '..', 'es5-jit-polyfills.js'));
                 }
             }
         }

package/src/angular-cli-files/models/webpack-configs/typescript.d.ts

@@ -9,7 +9,7 @@ export declare function getNonAotConfig(wco: WebpackConfigOptions): {
     };
     plugins: AngularCompilerPlugin[];
 };
-export declare function getAotConfig(wco: WebpackConfigOptions, extract?: boolean): {
+export declare function getAotConfig(wco: WebpackConfigOptions, i18nExtract?: boolean): {
     module: {
         rules: {
             test: RegExp;

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

@@ -34,12 +34,12 @@ function _pluginOptionsOverrides(buildOptions, pluginOptions) {
         compilerOptions
     };
 }
-function _createAotPlugin(wco, options, useMain = true, extract = false) {
+function _createAotPlugin(wco, options, i18nExtract = false) {
     const { root, buildOptions } = wco;
     const i18nInFile = buildOptions.i18nFile
         ? path.resolve(root, buildOptions.i18nFile)
         : undefined;
-    const i18nFileAndFormat = extract
+    const i18nFileAndFormat = i18nExtract
         ? {
             i18nOutFile: buildOptions.i18nFile,
             i18nOutFormat: buildOptions.i18nFormat,
@@ -54,7 +54,7 @@ function _createAotPlugin(wco, options, useMain = true, extract = false) {
         }
     }
     let pluginOptions = {
-        mainPath: useMain ? path.join(root, buildOptions.main) : undefined,
+        mainPath: path.join(root, buildOptions.main),
         ...i18nFileAndFormat,
         locale: buildOptions.i18nLocale,
         platform: buildOptions.platform === 'server' ? webpack_1.PLATFORM.Server : webpack_1.PLATFORM.Browser,
@@ -79,7 +79,7 @@ function getNonAotConfig(wco) {
     };
 }
 exports.getNonAotConfig = getNonAotConfig;
-function getAotConfig(wco, extract = false) {
+function getAotConfig(wco, i18nExtract = false) {
     const { tsConfigPath, buildOptions } = wco;
     const loaders = [webpack_1.NgToolsLoader];
     if (buildOptions.buildOptimizer) {
@@ -91,7 +91,7 @@ function getAotConfig(wco, extract = false) {
     const test = /(?:\.ngfactory\.js|\.ngstyle\.js|\.tsx?)$/;
     return {
         module: { rules: [{ test, use: loaders }] },
-        plugins: [_createAotPlugin(wco, { tsConfigPath }, true, extract)]
+        plugins: [_createAotPlugin(wco, { tsConfigPath }, i18nExtract)]
     };
 }
 exports.getAotConfig = getAotConfig;

package/src/angular-cli-files/models/webpack-configs/utils.d.ts

@@ -8,7 +8,6 @@
 import { ExtraEntryPoint, ExtraEntryPointClass } from '../../../browser/schema';
 import { SourceMapDevToolPlugin } from 'webpack';
 import { ScriptTarget } from 'typescript';
-export declare const ngAppResolve: (resolvePath: string) => string;
 export interface HashFormat {
     chunk: string;
     extract: string;

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

@@ -9,13 +9,9 @@
 // tslint:disable
 // TODO: cleanup this file, it's copied as is from Angular CLI.
 Object.defineProperty(exports, "__esModule", { value: true });
-const path = require("path");
 const core_1 = require("@angular-devkit/core");
 const webpack_1 = require("webpack");
 const typescript_1 = require("typescript");
-exports.ngAppResolve = (resolvePath) => {
-    return path.resolve(process.cwd(), resolvePath);
-};
 function getOutputHashFormat(option, length = 20) {
     /* tslint:disable:max-line-length */
     const hashFormats = {

package/src/angular-cli-files/utilities/package-chunk-sort.js

@@ -11,6 +11,7 @@ function generateEntryPoints(appConfig) {
         return [...new Set(entryPoints)];
     };
     const entryPoints = [
+        'polyfills-nomodule-es5',
         'polyfills-es5',
         'polyfills',
         'sw-register',

package/src/browser/index.js

@@ -108,9 +108,9 @@ function buildWebpackBrowser(options, context, transforms = {}) {
         const projectRoot = core_1.resolve(workspace.root, core_1.normalize(workspace.getProject(projectName).root));
         const tsConfigPath = path.resolve(core_1.getSystemPath(workspace.root), options.tsConfig);
         const tsConfig = read_tsconfig_1.readTsconfig(tsConfigPath);
-        if (utils_1.isEs5SupportNeeded(projectRoot) &&
-            tsConfig.options.target !== typescript_1.ScriptTarget.ES5 &&
-            tsConfig.options.target !== typescript_1.ScriptTarget.ES2015) {
+        const target = tsConfig.options.target || typescript_1.ScriptTarget.ES5;
+        const buildBrowserFeatures = new utils_1.BuildBrowserFeatures(core_1.getSystemPath(projectRoot), target);
+        if (target > typescript_1.ScriptTarget.ES2015 && buildBrowserFeatures.isDifferentialLoadingNeeded()) {
             context.logger.warn(core_1.tags.stripIndent `
           WARNING: Using differential loading with targets ES5 and ES2016 or higher may
           cause problems. Browsers with support for ES2015 will load the ES2016+ scripts

package/src/extract-i18n/index.js

@@ -52,6 +52,7 @@ async function execute(options, context) {
             scripts: false,
             styles: false,
         },
+        buildOptimizer: false,
         i18nLocale: options.i18nLocale,
         i18nFormat: options.i18nFormat,
         i18nFile: outFile,

package/src/utils/build-browser-features.d.ts

@@ -0,0 +1,35 @@
+/**
+ * @license
+ * Copyright Google Inc. 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
+ */
+import * as ts from 'typescript';
+export declare class BuildBrowserFeatures {
+    private projectRoot;
+    private scriptTarget;
+    private readonly _supportedBrowsers;
+    private readonly _es6TargetOrLater;
+    constructor(projectRoot: string, scriptTarget: ts.ScriptTarget);
+    /**
+     * True, when one or more browsers requires ES5
+     * support and the scirpt target is ES2015 or greater.
+     */
+    isDifferentialLoadingNeeded(): boolean;
+    /**
+     * True, when one or more browsers requires ES5 support
+     */
+    isEs5SupportNeeded(): boolean;
+    /**
+     * Safari 10.1 and iOS Safari 10.3 supports modules,
+     * but does not support the `nomodule` attribute.
+     * While return `true`, when support for Safari 10.1 and iOS Safari 10.3
+     * is required and in differential loading is enabled.
+     */
+    isNoModulePolyfillNeeded(): boolean;
+    /**
+     * True, when a browser feature is supported partially or fully.
+     */
+    isFeatureSupported(featureId: string): boolean;
+}

package/src/utils/build-browser-features.js

@@ -0,0 +1,74 @@
+"use strict";
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+const browserslist = require("browserslist");
+const caniuse_lite_1 = require("caniuse-lite");
+const ts = require("typescript");
+class BuildBrowserFeatures {
+    constructor(projectRoot, scriptTarget) {
+        this.projectRoot = projectRoot;
+        this.scriptTarget = scriptTarget;
+        this._supportedBrowsers = browserslist(undefined, { path: this.projectRoot });
+        this._es6TargetOrLater = this.scriptTarget > ts.ScriptTarget.ES5;
+    }
+    /**
+     * True, when one or more browsers requires ES5
+     * support and the scirpt target is ES2015 or greater.
+     */
+    isDifferentialLoadingNeeded() {
+        return this._es6TargetOrLater && this.isEs5SupportNeeded();
+    }
+    /**
+     * True, when one or more browsers requires ES5 support
+     */
+    isEs5SupportNeeded() {
+        return !this.isFeatureSupported('es6-module');
+    }
+    /**
+     * Safari 10.1 and iOS Safari 10.3 supports modules,
+     * but does not support the `nomodule` attribute.
+     * While return `true`, when support for Safari 10.1 and iOS Safari 10.3
+     * is required and in differential loading is enabled.
+     */
+    isNoModulePolyfillNeeded() {
+        if (!this.isDifferentialLoadingNeeded()) {
+            return false;
+        }
+        const safariBrowsers = [
+            'safari 10.1',
+            'ios_saf 10.3',
+        ];
+        return this._supportedBrowsers.some(browser => safariBrowsers.includes(browser));
+    }
+    /**
+     * True, when a browser feature is supported partially or fully.
+     */
+    isFeatureSupported(featureId) {
+        // y: feature is fully available
+        // n: feature is unavailable
+        // a: feature is partially supported
+        // x: feature is prefixed
+        const criteria = [
+            'y',
+            'a',
+        ];
+        const data = caniuse_lite_1.feature(caniuse_lite_1.features[featureId]);
+        return !this._supportedBrowsers
+            .some(browser => {
+            const [agentId, version] = browser.split(' ');
+            const browserData = data.stats[agentId];
+            const featureStatus = (browserData && browserData[version]);
+            // We are only interested in the first character
+            // Ex: when 'a #4 #5', we only need to check for 'a'
+            // as for such cases we should polyfill these features as needed
+            return !featureStatus || !criteria.includes(featureStatus.charAt(0));
+        });
+    }
+}
+exports.BuildBrowserFeatures = BuildBrowserFeatures;

package/src/utils/index.d.ts

@@ -5,9 +5,9 @@
  * Use of this source code is governed by an MIT-style license that can be
  * found in the LICENSE file at https://angular.io/license
  */
+export * from './build-browser-features';
 export * from './default-progress';
 export * from './delete-output-dir';
-export * from './differential-loading';
 export * from './run-module-as-observable-fork';
 export * from './normalize-file-replacements';
 export * from './normalize-asset-patterns';

package/src/utils/index.js

@@ -1,8 +1,4 @@
 "use strict";
-function __export(m) {
-    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
-}
-Object.defineProperty(exports, "__esModule", { value: true });
 /**
  * @license
  * Copyright Google Inc. All Rights Reserved.
@@ -10,9 +6,13 @@ 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
  */
+function __export(m) {
+    for (var p in m) if (!exports.hasOwnProperty(p)) exports[p] = m[p];
+}
+Object.defineProperty(exports, "__esModule", { value: true });
+__export(require("./build-browser-features"));
 __export(require("./default-progress"));
 __export(require("./delete-output-dir"));
-__export(require("./differential-loading"));
 __export(require("./run-module-as-observable-fork"));
 __export(require("./normalize-file-replacements"));
 __export(require("./normalize-asset-patterns"));

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

@@ -6,7 +6,7 @@ const path = require("path");
 const webpack_configs_1 = require("../angular-cli-files/models/webpack-configs");
 const read_tsconfig_1 = require("../angular-cli-files/utilities/read-tsconfig");
 const utils_1 = require("../utils");
-const differential_loading_1 = require("./differential-loading");
+const build_browser_features_1 = require("./build-browser-features");
 const SpeedMeasurePlugin = require('speed-measure-webpack-plugin');
 const webpackMerge = require('webpack-merge');
 async function generateWebpackConfig(context, workspaceRoot, projectRoot, sourceRoot, options, webpackPartialGenerator, logger) {
@@ -20,9 +20,11 @@ async function generateWebpackConfig(context, workspaceRoot, projectRoot, source
     const ts = await Promise.resolve().then(() => require('typescript'));
     // At the moment, only the browser builder supports differential loading
     // However this config generation is used by multiple builders such as dev-server
-    const scriptTarget = tsConfig.options.target;
+    const scriptTarget = tsConfig.options.target || ts.ScriptTarget.ES5;
+    const buildBrowserFeatures = new build_browser_features_1.BuildBrowserFeatures(projectRoot, scriptTarget);
     const differentialLoading = context.builder.builderName === 'browser'
-        && differential_loading_1.isDifferentialLoadingNeeded(projectRoot, scriptTarget) && !options.watch;
+        && !options.watch
+        && buildBrowserFeatures.isDifferentialLoadingNeeded();
     const scriptTargets = [scriptTarget];
     if (differentialLoading) {
         scriptTargets.unshift(ts.ScriptTarget.ES5);

package/src/utils/differential-loading.d.ts

@@ -1,10 +0,0 @@
-/**
- * @license
- * Copyright Google Inc. 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
- */
-import { ScriptTarget } from 'typescript';
-export declare function isDifferentialLoadingNeeded(projectRoot: string, target?: ScriptTarget): boolean;
-export declare function isEs5SupportNeeded(projectRoot: string): boolean;

package/src/utils/differential-loading.js

@@ -1,24 +0,0 @@
-"use strict";
-/**
- * @license
- * Copyright Google Inc. All Rights Reserved.
- *
- * Use of this source code is governed by an MIT-style license that can be
- * found in the LICENSE file at https://angular.io/license
- */
-Object.defineProperty(exports, "__esModule", { value: true });
-const browserslist = require("browserslist");
-const caniuse = require("caniuse-api");
-const typescript_1 = require("typescript");
-function isDifferentialLoadingNeeded(projectRoot, target = typescript_1.ScriptTarget.ES5) {
-    const supportES2015 = target !== typescript_1.ScriptTarget.ES3 && target !== typescript_1.ScriptTarget.ES5;
-    return supportES2015 && isEs5SupportNeeded(projectRoot);
-}
-exports.isDifferentialLoadingNeeded = isDifferentialLoadingNeeded;
-function isEs5SupportNeeded(projectRoot) {
-    const browsersList = browserslist(undefined, {
-        path: projectRoot,
-    });
-    return !caniuse.isSupported('es6-module', browsersList.join(', '));
-}
-exports.isEs5SupportNeeded = isEs5SupportNeeded;