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

@@ -14,6 +14,8 @@ import { Compiler, compilation } from 'webpack';
 const CommonJsRequireDependency = require('webpack/lib/dependencies/CommonJsRequireDependency');
 const AMDDefineDependency = require('webpack/lib/dependencies/AMDDefineDependency');
 
+const STYLES_TEMPLATE_URL_REGEXP = /\.(html|svg|css|sass|less|styl|scss)$/;
+
 // The below is extended because there are not in the typings
 interface WebpackModule extends compilation.Module {
   name?: string;
@@ -23,6 +25,10 @@ interface WebpackModule extends compilation.Module {
   userRequest?: string;
 }
 
+interface CommonJsRequireDependencyType {
+  request: string;
+}
+
 export interface CommonJsUsageWarnPluginOptions {
   /** A list of CommonJS packages that are allowed to be used without a warning. */
   allowedDepedencies?: string[];
@@ -61,7 +67,7 @@ export class CommonJsUsageWarnPlugin {
             continue;
           }
 
-          if (this.hasCommonJsDependencies(dependencies)) {
+          if (this.hasCommonJsDependencies(dependencies, true)) {
             // Dependency is CommonsJS or AMD.
 
             // Check if it's parent issuer is also a CommonJS dependency.
@@ -97,8 +103,23 @@ export class CommonJsUsageWarnPlugin {
     });
   }
 
-  private hasCommonJsDependencies(dependencies: unknown[]): boolean {
-    return dependencies.some(d => d instanceof CommonJsRequireDependency || d instanceof AMDDefineDependency);
+  private hasCommonJsDependencies(dependencies: unknown[], checkForStylesAndTemplatesCJS = false): boolean {
+    for (const dep of dependencies) {
+      if (dep instanceof CommonJsRequireDependency) {
+        if (checkForStylesAndTemplatesCJS && STYLES_TEMPLATE_URL_REGEXP.test((dep as CommonJsRequireDependencyType).request)) {
+          // Skip in case it's a template or stylesheet
+          continue;
+        }
+
+        return true;
+      }
+
+      if (dep instanceof AMDDefineDependency) {
+        return true;
+      }
+    }
+
+    return false;
   }
 
   private rawRequestToPackageName(rawRequest: string): string {

packages/angular_devkit/build_angular/src/angular-cli-files/utilities/stats.ts

@@ -100,10 +100,11 @@ export function statsWarningsToString(json: any, statsConfig: any) {
   }
 
   return rs('\n' + warnings
-      .map((warning: any) => `${warning}`)
-      .filter((warning: string) => !ERRONEOUS_WARNINGS.some((erroneous) => erroneous.test(warning)))
-      .map((warning: string) => y(`WARNING in ${warning}`))
-      .join('\n\n'));
+    .filter(m => !!m)
+    .map((warning: any) => `${warning}`)
+    .filter((warning: string) => !ERRONEOUS_WARNINGS.some((erroneous) => erroneous.test(warning)))
+    .map((warning: string) => y(`WARNING in ${warning}`))
+    .join('\n\n'));
 }
 
 export function statsErrorsToString(json: any, statsConfig: any) {
@@ -115,7 +116,11 @@ export function statsErrorsToString(json: any, statsConfig: any) {
     errors.push(...json.children.map((c: any) => c.errors));
   }
 
-  return rs('\n' + errors.map((error: any) => r(`ERROR in ${error}`)).join('\n'));
+  return rs('\n' + errors
+    .filter(m => !!m)
+    .map((error: any) => r(`ERROR in ${error}`))
+    .join('\n\n')
+  );
 }
 
 export function statsHasErrors(json: any): boolean {

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

@@ -77,4 +77,24 @@ describe('Browser Builder commonjs warning', () => {
     expect(logs.join()).not.toContain('WARNING');
     await run.stop();
   });
+
+  it('should not show warning in JIT for templateUrl and styleUrl when using paths', async () => {
+    host.replaceInFile('tsconfig.base.json', /"baseUrl": ".\/",/, `
+      "baseUrl": "./",
+      "paths": {
+        "@app/*": [
+          "src/app/*"
+        ]
+      },
+    `);
+
+    host.replaceInFile('src/app/app.module.ts', './app.component', '@app/app.component');
+
+    const run = await architect.scheduleTarget(targetSpec, { aot: false }, { logger });
+    const output = await run.result;
+    expect(output.success).toBe(true);
+
+    expect(logs.join()).not.toContain('WARNING');
+    await run.stop();
+  });
 });

packages/angular_devkit/build_angular/src/browser/specs/differential_loading_spec.ts

@@ -10,6 +10,7 @@ import { Architect } from '@angular-devkit/architect';
 import { PathFragment } from '@angular-devkit/core';
 import { browserBuild, createArchitect, host } from '../../test-utils';
 
+// tslint:disable-next-line: no-big-function
 describe('Browser Builder with differential loading', () => {
   const target = { project: 'app', target: 'build' };
   let architect: Architect;
@@ -181,6 +182,12 @@ describe('Browser Builder with differential loading', () => {
     expect(await files['main-es2015.js']).toContain('const ');
   });
 
+  it('wraps ES5 scripts in an IIFE', async () => {
+    const { files } = await browserBuild(architect, host, target, { optimization: false });
+    expect(await files['main-es5.js']).toMatch(/^\(function \(\) \{/);
+    expect(await files['main-es2015.js']).not.toMatch(/^\(function \(\) \{/);
+  });
+
   it('uses the right zone.js variant', async () => {
     const { files } = await browserBuild(architect, host, target, { optimization: false });
     expect(await files['polyfills-es5.js']).toContain('zone.js/dist/zone-legacy');

packages/angular_devkit/build_angular/src/browser/specs/web-worker_spec.ts

@@ -147,7 +147,7 @@ describe('Browser Builder Web Worker support', () => {
     const { run } = await timer(1000).pipe(
       switchMap(() => architect.scheduleTarget(target, overrides)),
       switchMap(run => run.output.pipe(map(output => ({ run, output })))),
-      debounceTime(500),
+      debounceTime(1000),
       tap(({ output }) => expect(output.success).toBe(true, 'build should succeed')),
       tap(() => {
         switch (phase) {

packages/angular_devkit/build_angular/src/utils/process-bundle.ts

@@ -157,7 +157,10 @@ export async function process(options: ProcessBundleOptions): Promise<ProcessBun
           exclude: ['transform-typeof-symbol'],
         },
       ]],
-      plugins: options.replacements ? [createReplacePlugin(options.replacements)] : [],
+      plugins: [
+        createIifeWrapperPlugin(),
+        ...(options.replacements ? [createReplacePlugin(options.replacements)] : []),
+      ],
       minified: allowMinify && !!options.optimize,
       compact: !shouldBeautify && !!options.optimize,
       sourceMaps: !!sourceMap,
@@ -509,6 +512,36 @@ function createReplacePlugin(replacements: [string, string][]): PluginObj {
   };
 }
 
+function createIifeWrapperPlugin(): PluginObj {
+  return {
+    visitor: {
+      Program: {
+        exit(path: NodePath<types.Program>) {
+          // Save existing body and directives
+          const { body, directives } = path.node;
+
+          // Clear out body and directives for wrapper
+          path.node.body = [];
+          path.node.directives = [];
+
+          // Create the wrapper - "(function() { ... })();"
+          const wrapper = types.expressionStatement(
+            types.callExpression(
+              types.parenthesizedExpression(
+                types.functionExpression(undefined, [], types.blockStatement(body, directives)),
+              ),
+              [],
+            ),
+          );
+
+          // Insert the wrapper
+          path.pushContainer('body', wrapper);
+        },
+      },
+    },
+  };
+}
+
 const USE_LOCALIZE_PLUGINS = false;
 
 export async function createI18nPlugins(

packages/schematics/angular/application/index_spec.ts

@@ -88,7 +88,6 @@ describe('Application Schematic', () => {
     expect(references).toEqual([
       { path: './projects/foo/tsconfig.app.json' },
       { path: './projects/foo/tsconfig.spec.json' },
-      { path: './projects/foo/e2e/tsconfig.json' },
     ]);
   });
 

packages/schematics/angular/e2e/index.ts

@@ -18,7 +18,7 @@ import {
   url,
 } from '@angular-devkit/schematics';
 import { relativePathToWorkspaceRoot } from '../utility/paths';
-import { addTsConfigProjectReferences, verifyBaseTsConfigExists } from '../utility/tsconfig';
+import { verifyBaseTsConfigExists } from '../utility/tsconfig';
 import { getWorkspace, updateWorkspace } from '../utility/workspace';
 import { Builders } from '../utility/workspace-models';
 import { Schema as E2eOptions } from './schema';
@@ -68,9 +68,6 @@ export default function (options: E2eOptions): Rule {
           }),
           move(root),
         ])),
-      addTsConfigProjectReferences([
-        e2eTsConfig,
-      ]),
     ]);
   };
 }

packages/schematics/angular/e2e/index_spec.ts

@@ -82,19 +82,6 @@ describe('Application Schematic', () => {
     expect(content).toMatch(/🌮-🌯/);
   });
 
-  it('should add reference in solution style tsconfig', async () => {
-    const tree = await schematicRunner.runSchematicAsync('e2e', defaultOptions, applicationTree)
-      .toPromise();
-
-    // tslint:disable-next-line:no-any
-    const { references } = parseJson(tree.readContent('/tsconfig.json').toString(), JsonParseMode.Loose) as any;
-    expect(references).toEqual([
-      { path: './projects/foo/tsconfig.app.json' },
-      { path: './projects/foo/tsconfig.spec.json' },
-      { path: './projects/foo/e2e/tsconfig.json' },
-    ]);
-  });
-
   describe('workspace config', () => {
     it('should add e2e targets for the app', async () => {
       const tree = await schematicRunner.runSchematicAsync('e2e', defaultOptions, applicationTree)

packages/schematics/angular/module/files/__name@dasherize@if-flat__/__name@dasherize__-routing.module.ts.template

@@ -1,6 +1,6 @@
 import { NgModule } from '@angular/core';
-import { Routes, RouterModule } from '@angular/router';
-<% if (lazyRoute) { %>
+import { Routes, RouterModule } from '@angular/router';<% if (lazyRoute) { %>
+
 import { <%= classify(name) %>Component } from './<%= dasherize(name) %>.component';<% } %>
 
 const routes: Routes = [<% if (lazyRoute) { %>{ path: '', component: <%= classify(name) %>Component }<% } %>];

packages/schematics/angular/service-worker/files/ngsw-config.json.template

@@ -14,7 +14,8 @@
           "/*.js"
         ]
       }
-    }, {
+    },
+    {
       "name": "assets",
       "installMode": "lazy",
       "updateMode": "prefetch",

packages/schematics/angular/universal/index_spec.ts

@@ -273,10 +273,8 @@ describe('Universal Schematic', () => {
     expect(references).toEqual([
       { path: './tsconfig.app.json' },
       { path: './tsconfig.spec.json' },
-      { path: './e2e/tsconfig.json' },
       { path: './projects/bar/tsconfig.app.json' },
       { path: './projects/bar/tsconfig.spec.json' },
-      { path: './projects/bar/e2e/tsconfig.json' },
       { path: './tsconfig.server.json' },
     ]);
   });

packages/schematics/angular/utility/latest-versions.ts

@@ -8,7 +8,7 @@
 
 export const latestVersions = {
   // These versions should be kept up to date with latest Angular peer dependencies.
-  Angular: '~10.0.3',
+  Angular: '~10.0.4',
   RxJs: '~6.5.5',
   ZoneJs: '~0.10.3',
   TypeScript: '~3.9.5',
@@ -18,9 +18,9 @@ export const latestVersions = {
   // For our e2e tests, these versions must match the latest tag present on the branch.
   // During RC periods they will not match the latest RC until there's a new git tag, and
   // should not be updated.
-  DevkitBuildAngular: '~0.1000.2',
-  DevkitBuildNgPackagr: '~0.1000.2',
-  DevkitBuildWebpack: '~0.1000.2',
+  DevkitBuildAngular: '~0.1000.3',
+  DevkitBuildNgPackagr: '~0.1000.3',
+  DevkitBuildWebpack: '~0.1000.3',
 
   ngPackagr: '^10.0.0',
 };

packages/schematics/angular/web-worker/index_spec.ts

@@ -162,7 +162,6 @@ describe('Web Worker Schematic', () => {
     expect(references).toEqual([
       { path: './projects/bar/tsconfig.app.json' },
       { path: './projects/bar/tsconfig.spec.json' },
-      { path: './projects/bar/e2e/tsconfig.json' },
       { path: './projects/bar/tsconfig.worker.json' },
     ]);
   });

tests/legacy-cli/e2e/tests/schematics_cli/blank-test.ts

@@ -1,3 +1,4 @@
+import * as fs from 'fs';
 import * as path from 'path';
 import { getGlobalVariable } from '../../utils/env';
 import { exec, silentNpm } from '../../utils/process';
@@ -10,11 +11,12 @@ export default async function () {
     return;
   }
 
+  fs.writeFileSync('.npmrc', 'registry = http://localhost:4873', 'utf8');
+
   await silentNpm(
     'install',
     '-g',
     '@angular-devkit/schematics-cli',
-    '--registry=http://localhost:4873',
   );
   await exec(process.platform.startsWith('win') ? 'where' : 'which', 'schematics');
 

tests/legacy-cli/e2e/tests/schematics_cli/schematic-test.ts

@@ -1,3 +1,4 @@
+import * as fs from 'fs';
 import * as path from 'path';
 import { getGlobalVariable } from '../../utils/env';
 import { exec, silentNpm } from '../../utils/process';
@@ -10,11 +11,12 @@ export default async function () {
     return;
   }
 
+  fs.writeFileSync('.npmrc', 'registry = http://localhost:4873', 'utf8');
+
   await silentNpm(
     'install',
     '-g',
     '@angular-devkit/schematics-cli',
-    '--registry=http://localhost:4873',
   );
   await exec(process.platform.startsWith('win') ? 'where' : 'which', 'schematics');