package.json

@@ -136,7 +136,7 @@
     "common-tags": "^1.8.0",
     "conventional-changelog": "^3.0.0",
     "conventional-commits-parser": "^3.0.0",
-    "copy-webpack-plugin": "6.0.2",
+    "copy-webpack-plugin": "6.0.3",
     "core-js": "3.6.4",
     "css-loader": "3.5.2",
     "cssnano": "4.1.10",

packages/angular/cli/commands/update-impl.ts

@@ -667,7 +667,9 @@ export class UpdateCommand extends Command<UpdateCommandSchema> {
       for (const migration of migrations) {
         const result = await this.executeMigrations(
           migration.package,
-          migration.collection,
+          // Resolve the collection from the workspace root, as otherwise it will be resolved from the temp
+          // installed CLI version.
+          require.resolve(migration.collection, { paths: [this.workspace.root] }),
           new semver.Range('>' + migration.from + ' <=' + migration.to),
           options.createCommits,
         );

packages/angular_devkit/build_angular/package.json

@@ -26,7 +26,7 @@
     "cacache": "15.0.3",
     "caniuse-lite": "^1.0.30001032",
     "circular-dependency-plugin": "5.2.0",
-    "copy-webpack-plugin": "6.0.2",
+    "copy-webpack-plugin": "6.0.3",
     "core-js": "3.6.4",
     "css-loader": "3.5.3",
     "cssnano": "4.1.10",

packages/angular_devkit/build_angular/src/angular-cli-files/models/webpack-configs/common.ts

@@ -308,7 +308,7 @@ export function getCommonConfig(wco: WebpackConfigOptions): Configuration {
       new (class {
         apply(compiler: Compiler) {
           compiler.hooks.emit.tap('angular-cli-stats', compilation => {
-            const data = JSON.stringify(compilation.getStats().toJson('verbose'));
+            const data = JSON.stringify(compilation.getStats().toJson('verbose'), undefined, 2);
             compilation.assets['stats.json'] = new RawSource(data);
           });
         }

packages/angular_devkit/build_angular/src/angular-cli-files/plugins/common-js-usage-warn-plugin.ts

@@ -34,14 +34,10 @@ export class CommonJsUsageWarnPlugin {
   // Allow the below depedency for HMR
   // tslint:disable-next-line: max-line-length
   // https://github.com/angular/angular-cli/blob/1e258317b1f6ec1e957ee3559cc3b28ba602f3ba/packages/angular_devkit/build_angular/src/dev-server/index.ts#L605-L638
-  private allowedDepedencies = [
-    'webpack/hot/dev-server',
-  ];
+  private allowedDepedencies = new Set<string>(['webpack/hot/dev-server']);
 
   constructor(private options: CommonJsUsageWarnPluginOptions = {}) {
-    if (this.options.allowedDepedencies) {
-      this.allowedDepedencies.push(...this.options.allowedDepedencies);
-    }
+    this.options.allowedDepedencies?.forEach(d => this.allowedDepedencies.add(d));
   }
 
   apply(compiler: Compiler) {
@@ -57,7 +53,10 @@ export class CommonJsUsageWarnPlugin {
             continue;
           }
 
-          if (this.allowedDepedencies?.includes(rawRequest)) {
+          if (
+            this.allowedDepedencies.has(rawRequest) ||
+            this.allowedDepedencies.has(this.rawRequestToPackageName(rawRequest))
+          ) {
             // Skip as this module is allowed even if it's a CommonJS.
             continue;
           }
@@ -67,7 +66,8 @@ export class CommonJsUsageWarnPlugin {
 
             // Check if it's parent issuer is also a CommonJS dependency.
             // In case it is skip as an warning will be show for the parent CommonJS dependency.
-            if (this.hasCommonJsDependencies(issuer?.issuer?.dependencies ?? [])) {
+            const parentDependencies = issuer?.issuer?.dependencies;
+            if (parentDependencies && this.hasCommonJsDependencies(parentDependencies)) {
               continue;
             }
 
@@ -81,8 +81,16 @@ export class CommonJsUsageWarnPlugin {
             // And if the issuer request is not from 'webpack-dev-server', as 'webpack-dev-server'
             // will require CommonJS libraries for live reloading such as 'sockjs-node'.
             if (mainIssuer?.name === 'main' && !issuer?.userRequest?.includes('webpack-dev-server')) {
-              const warning = `${issuer?.userRequest} depends on ${rawRequest}. CommonJS or AMD dependencies can cause optimization bailouts.\n` +
-                'For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies';
+              let warning = `${issuer?.userRequest} depends on '${rawRequest}'.`;
+
+              if (rawRequest.startsWith('@angular/common/locales')) {
+                warning += `\nWhen using the 'localize' option this import is not needed. ` +
+                  `Did you mean to import '${rawRequest.replace(/locales(\/extra)?\//, 'locales/global/')}'?\n` +
+                  'For more info see: https://angular.io/guide/i18n#import-global-variants-of-the-locale-data';
+              } else {
+                warning += ' CommonJS or AMD dependencies can cause optimization bailouts.\n' +
+                  'For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies';
+              }
 
               // Avoid showing the same warning multiple times when in 'watch' mode.
               if (!this.shownWarnings.has(warning)) {
@@ -100,4 +108,12 @@ export class CommonJsUsageWarnPlugin {
     return dependencies.some(d => d instanceof CommonJsRequireDependency || d instanceof AMDDefineDependency);
   }
 
+  private rawRequestToPackageName(rawRequest: string): string {
+    return rawRequest.startsWith('@')
+      // Scoped request ex: @angular/common/locale/en -> @angular/common
+      ? rawRequest.split('/', 2).join('/')
+      // Non-scoped request ex: lodash/isEmpty -> lodash
+      : rawRequest.split('/', 1)[0];
+  }
+
 }

packages/angular_devkit/build_angular/src/angular-cli-files/plugins/dedupe-module-resolve-plugin.ts

@@ -14,11 +14,13 @@ interface NormalModuleFactoryRequest {
   relativePath: string;
   path: string;
   descriptionFileData: {
-    name: string;
-    version: string;
+    name?: string;
+    version?: string;
   };
   descriptionFileRoot: string;
   descriptionFilePath: string;
+  directory?: boolean;
+  file?: boolean;
 }
 
 export interface DedupeModuleResolvePluginOptions {
@@ -45,6 +47,17 @@ export class DedupeModuleResolvePlugin {
           return;
         }
 
+        // When either of these properties is undefined. It typically means it's a link.
+        // In which case we shouldn't try to dedupe it.
+        if (request.file === undefined || request.directory === undefined) {
+          return;
+        }
+
+        // Empty name or versions are no valid primary entrypoints of a library
+        if (!request.descriptionFileData.name || !request.descriptionFileData.version) {
+          return;
+        }
+
         const moduleId = request.descriptionFileData.name + '@' + request.descriptionFileData.version;
         const prevResolvedModule = this.modules.get(moduleId);
 

packages/angular_devkit/build_angular/src/browser/index.ts

@@ -201,12 +201,31 @@ async function initialize(
   i18n: I18nOptions;
 }> {
   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,
-  } = await buildBrowserWebpackConfigFromContext(options, context, host, true);
+  } = await buildBrowserWebpackConfigFromContext(adjustedOptions, context, host, true);
+
+  // Validate asset option values if processed directly
+  if (options.assets?.length && !adjustedOptions.assets?.length) {
+    normalizeAssetPatterns(
+      options.assets,
+      new virtualFs.SyncDelegateHost(host),
+      normalize(context.workspaceRoot),
+      normalize(projectRoot),
+      projectSourceRoot === undefined ? undefined : normalize(projectSourceRoot),
+    ).forEach(({ output }) => {
+      if (output.startsWith('..')) {
+        throw new Error('An asset cannot be written to a location outside of the output path.');
+      }
+    });
+  }
 
   let transformedConfig;
   if (webpackConfigurationTransform) {
@@ -573,27 +592,6 @@ export function buildWebpackBrowser(
                 executor.stop();
               }
 
-              // Copy assets
-              if (options.assets) {
-                try {
-                  await copyAssets(
-                    normalizeAssetPatterns(
-                      options.assets,
-                      new virtualFs.SyncDelegateHost(host),
-                      root,
-                      normalize(projectRoot),
-                      projectSourceRoot === undefined ? undefined : normalize(projectSourceRoot),
-                    ),
-                    Array.from(outputPaths.values()),
-                    context.workspaceRoot,
-                  );
-                } catch (err) {
-                  context.logger.error('Unable to copy assets: ' + err.message);
-
-                  return { success: false };
-                }
-              }
-
               type ArrayElement<A> = A extends ReadonlyArray<infer T> ? T : never;
               function generateBundleInfoStats(
                 id: string | number,
@@ -698,6 +696,27 @@ export function buildWebpackBrowser(
               }
             }
 
+            // Copy assets
+            if (!options.watch && options.assets) {
+              try {
+                await copyAssets(
+                  normalizeAssetPatterns(
+                    options.assets,
+                    new virtualFs.SyncDelegateHost(host),
+                    root,
+                    normalize(projectRoot),
+                    projectSourceRoot === undefined ? undefined : normalize(projectSourceRoot),
+                  ),
+                  Array.from(outputPaths.values()),
+                  context.workspaceRoot,
+                );
+              } catch (err) {
+                context.logger.error('Unable to copy assets: ' + err.message);
+
+                return { success: false };
+              }
+            }
+
             if (options.index) {
               for (const [locale, outputPath] of outputPaths.entries()) {
                 let localeBaseHref;

packages/angular_devkit/build_angular/src/browser/specs/common-js-warning_spec.ts

@@ -20,9 +20,6 @@ describe('Browser Builder commonjs warning', () => {
     await host.initialize().toPromise();
     architect = (await createArchitect(host.root())).architect;
 
-    // Add a Common JS dependency
-    host.appendToFile('src/app/app.component.ts', `import 'bootstrap';`);
-
     // Create logger
     logger = new logging.Logger('');
     logs = [];
@@ -32,19 +29,31 @@ describe('Browser Builder commonjs warning', () => {
   afterEach(async () => host.restore().toPromise());
 
   it('should show warning when depending on a Common JS bundle', async () => {
+    // Add a Common JS dependency
+    host.appendToFile('src/app/app.component.ts', `
+      import 'bootstrap';
+    `);
+
     const run = await architect.scheduleTarget(targetSpec, undefined, { logger });
     const output = await run.result;
     expect(output.success).toBe(true);
     const logMsg = logs.join();
-    expect(logMsg).toMatch(/WARNING in.+app\.component\.ts depends on bootstrap\. CommonJS or AMD dependencies/);
+    expect(logMsg).toMatch(/WARNING in.+app\.component\.ts depends on 'bootstrap'\. CommonJS or AMD dependencies/);
     expect(logMsg).not.toContain('jquery', 'Should not warn on transitive CommonJS packages which parent is also CommonJS.');
     await run.stop();
   });
 
   it('should not show warning when depending on a Common JS bundle which is allowed', async () => {
+    // Add a Common JS dependency
+    host.appendToFile('src/app/app.component.ts', `
+      import 'bootstrap';
+      import 'zone.js/dist/zone-error';
+    `);
+
     const overrides = {
       allowedCommonJsDependencies: [
         'bootstrap',
+        'zone.js',
       ],
     };
 
@@ -54,4 +63,20 @@ describe('Browser Builder commonjs warning', () => {
     expect(logs.join()).not.toContain('WARNING');
     await run.stop();
   });
+
+  it(`should show warning when importing non global '@angular/common/locale' data`, async () => {
+    // Add a Common JS dependency
+    host.appendToFile('src/app/app.component.ts', `
+      import '@angular/common/locales/fr';
+    `);
+
+    const run = await architect.scheduleTarget(targetSpec, undefined, { logger });
+    const output = await run.result;
+    expect(output.success).toBe(true);
+
+    const logMsg = logs.join();
+    expect(logMsg).toMatch(/WARNING in.+app\.component\.ts depends on '@angular\/common\/locales\/fr'/);
+    expect(logMsg).toContain(`Did you mean to import '@angular/common/locales/global/fr'`);
+    await run.stop();
+  });
 });

packages/schematics/angular/application/files/.browserslistrc.template

@@ -14,5 +14,7 @@ last 2 Edge major versions
 last 2 Safari major version
 last 2 iOS major versions
 Firefox ESR<% if (legacyBrowsers) { %>
-IE 9-11<% } else { %>
-not IE 9-11 # For IE 9-11 support, remove 'not'.<% } %>
+IE 9-10 # Angular support for IE 9-10 has been deprecated and will be removed as of Angular v11.
+IE 11<% } else { %>
+not IE 9-10 # Angular support for IE 9-10 has been deprecated and will be removed as of Angular v11. To opt-in, remove the 'not' prefix on this line.
+not IE 11 # Angular supports IE 11 only as an opt-in. To opt-in, remove the 'not' prefix on this line.<% } %>

packages/schematics/angular/application/index_spec.ts

@@ -445,15 +445,19 @@ describe('Application Schematic', () => {
     const tree = await schematicRunner.runSchematicAsync('application', options, workspaceTree)
       .toPromise();
     const content = tree.readContent('/projects/foo/.browserslistrc');
-    expect(content).not.toContain(`not IE 9-11 # For IE 9-11 support, remove 'not'.`);
-    expect(content).toContain('IE 9-11');
+    expect(content).not.toContain('not IE 11');
+    expect(content).toContain('IE 11');
+
+    expect(content).not.toContain('not IE 9-10');
+    expect(content).toContain('IE 9-10');
   });
 
   it(`should not add support for IE 9-11 in '.browserslistrc' when 'legacyBrowsers' is false`, async () => {
     const options: ApplicationOptions = { ...defaultOptions, legacyBrowsers: false };
     const tree = await schematicRunner.runSchematicAsync('application', options, workspaceTree)
       .toPromise();
     const content = tree.readContent('/projects/foo/.browserslistrc');
-    expect(content).toContain(`not IE 9-11 # For IE 9-11 support, remove 'not'.`);
+    expect(content).toContain('not IE 11');
+    expect(content).toContain('not IE 9-10');
   });
 });

packages/schematics/angular/migrations/migration-collection.json

@@ -95,15 +95,15 @@
       "factory": "./update-10/solution-style-tsconfig",
       "description": "Add \"Solution Style\" TypeScript configuration file support. This improves developer experience using editors powered by TypeScript’s language server. Read more about this here: https://v10.angular.io/guide/migration-solution-style-tsconfig"
     },
-    "update-module-and-target-compiler-options": {
-      "version": "10.0.0-rc.1",
-      "factory": "./update-10/update-module-and-target-compiler-options",
-      "description": "Update 'module' and 'target' TypeScript compiler options. Read more about this here: https://v10.angular.io/guide/migration-update-module-and-target-compiler-options"
-    },
     "update-workspace-dependencies": {
       "version": "10.0.0-rc.2",
       "factory": "./update-10/update-dependencies",
       "description": "Update workspace dependencies to match a new v10 project."
+    },
+    "update-module-and-target-compiler-options": {
+      "version": "10.0.1",
+      "factory": "./update-10/update-module-and-target-compiler-options",
+      "description": "Update 'module' and 'target' TypeScript compiler options. Read more about this here: https://v10.angular.io/guide/migration-update-module-and-target-compiler-options"
     }
   }
 }

packages/schematics/angular/migrations/update-10/solution-style-tsconfig.ts

@@ -5,7 +5,7 @@
  * 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 { JsonAstString, JsonParseMode, dirname, join, normalize, parseJsonAst, resolve } from '@angular-devkit/core';
+import { JsonAstNode, JsonAstString, JsonParseMode, dirname, join, normalize, parseJsonAst, resolve } from '@angular-devkit/core';
 import { DirEntry, Rule, chain } from '@angular-devkit/schematics';
 import { findPropertyInAstObject } from '../../utility/json-utils';
 import { getWorkspace } from '../../utility/workspace';
@@ -25,11 +25,18 @@ function* visitExtendedJsonFiles(directory: DirEntry): IterableIterator<[string,
     }
 
     const entry = directory.file(path);
-    if (!entry) {
+    const content = entry?.content.toString();
+    if (!content) {
       continue;
     }
 
-    const jsonAst = parseJsonAst(entry.content.toString(), JsonParseMode.Loose);
+    let jsonAst: JsonAstNode;
+    try {
+      jsonAst = parseJsonAst(content, JsonParseMode.Loose);
+    } catch {
+      throw new Error(`Invalid JSON AST Object (${path})`);
+    }
+
     if (jsonAst.kind !== 'object') {
       continue;
     }

packages/schematics/angular/migrations/update-10/solution-style-tsconfig_spec.ts

@@ -114,4 +114,10 @@ describe('Migration to create "Solution Style" tsconfig', () => {
       ],
     });
   });
+
+  it('should not error out when a JSON file is a blank', async () => {
+    tree.create('blank.json', '');
+    const newTree = await schematicRunner.runSchematicAsync(schematicName, {}, tree).toPromise();
+    expect(readJsonFile(newTree, 'src/tsconfig.json').extends).toEqual('./../tsconfig.base.json');
+  });
 });

packages/schematics/angular/migrations/update-10/update-module-and-target-compiler-options.ts

@@ -23,7 +23,7 @@ interface ModuleAndTargetReplamenent {
 export default function (): Rule {
   return async host => {
     // Workspace level tsconfig
-    updateModuleAndTarget(host, 'tsconfig.json', {
+    updateModuleAndTarget(host, 'tsconfig.base.json', {
       oldModule: 'esnext',
       newModule: 'es2020',
     });