refactor(@angular-devkit/build-angular): remove deprecated lazyModules option

alan-agius4 · filipesilva · commit 8d669123236c · 2021-03-10T12:44:04.000-06:00
BREAKING CHANGE:

Server and Browser builder `lazyModules` option has been removed without replacement.
diff --git a/packages/angular_devkit/build_angular/src/browser/schema.json b/packages/angular_devkit/build_angular/src/browser/schema.json
@@ -353,15 +353,6 @@
       "description": "Run the TypeScript type checker in a forked process.",
       "default": true
     },
-    "lazyModules": {
-      "description": "List of additional NgModule files that will be lazy loaded. Lazy router modules will be discovered automatically.",
-      "type": "array",
-      "items": {
-        "type": "string"
-      },
-      "x-deprecated": "'SystemJsNgModuleLoader' is deprecated, and this is part of its usage. Use 'import()' syntax instead.",
-      "default": []
-    },
     "budgets": {
       "description": "Budget thresholds to ensure parts of your application stay within boundaries which you set.",
       "type": "array",
diff --git a/packages/angular_devkit/build_angular/src/browser/specs/lazy-module_spec.ts b/packages/angular_devkit/build_angular/src/browser/specs/lazy-module_spec.ts
@@ -16,7 +16,6 @@ import {
   host,
   lazyModuleFiles,
   lazyModuleFnImport,
-  lazyModuleStringImport,
   veEnabled,
 } from '../../test-utils';
 
@@ -54,40 +53,30 @@ describe('Browser Builder lazy modules', () => {
       logs.includes('Module not found');
   }
 
-  const cases: [string, Record<string, string>][] = [
-    ['string', lazyModuleStringImport],
-    ['function', lazyModuleFnImport],
-  ];
-  for (const [name, imports] of cases) {
-    describe(`Load children ${name} syntax`, () => {
-      it('supports lazy bundle for lazy routes with JIT', async () => {
-        host.writeMultipleFiles(lazyModuleFiles);
-        host.writeMultipleFiles(imports);
-
-        if (name === 'string') {
-          addLazyLoadedModulesInTsConfig(host, lazyModuleFiles);
-        }
-
-        const { files } = await browserBuild(architect, host, target);
-        expect('lazy-lazy-module.js' in files).toBe(true);
-      });
+  describe(`Load children syntax`, () => {
+    it('supports lazy bundle for lazy routes with JIT', async () => {
+      host.writeMultipleFiles(lazyModuleFiles);
+      host.writeMultipleFiles(lazyModuleFnImport);
 
-      it('supports lazy bundle for lazy routes with AOT', async () => {
-        host.writeMultipleFiles(lazyModuleFiles);
-        host.writeMultipleFiles(imports);
-        addLazyLoadedModulesInTsConfig(host, lazyModuleFiles);
+      const { files } = await browserBuild(architect, host, target);
+      expect('lazy-lazy-module.js' in files).toBe(true);
+    });
 
-        const { files } = await browserBuild(architect, host, target, { aot: true });
-        if (!veEnabled) {
-          const data = await files['lazy-lazy-module.js'];
-          expect(data).not.toBeUndefined('Lazy module output bundle does not exist');
-          expect(data).toContain('LazyModule.ɵmod');
-        } else {
-          expect(files['lazy-lazy-module-ngfactory.js']).not.toBeUndefined();
-        }
-      });
+    it('supports lazy bundle for lazy routes with AOT', async () => {
+      host.writeMultipleFiles(lazyModuleFiles);
+      host.writeMultipleFiles(lazyModuleFnImport);
+      addLazyLoadedModulesInTsConfig(host, lazyModuleFiles);
+
+      const { files } = await browserBuild(architect, host, target, { aot: true });
+      if (!veEnabled) {
+        const data = await files['lazy-lazy-module.js'];
+        expect(data).not.toBeUndefined('Lazy module output bundle does not exist');
+        expect(data).toContain('LazyModule.ɵmod');
+      } else {
+        expect(files['lazy-lazy-module-ngfactory.js']).not.toBeUndefined();
+      }
     });
-  }
+  });
 
   // Errors for missing lazy routes are only supported with function syntax.
   // `ngProgram.listLazyRoutes` will ignore invalid lazy routes in the route map.
@@ -202,69 +191,4 @@ describe('Browser Builder lazy modules', () => {
     expect(files['two.js']).not.toBeUndefined();
     expect(files['common.js']).toBeUndefined();
   });
-
-  it(`supports extra lazy modules array in JIT`, async () => {
-    host.writeMultipleFiles(lazyModuleFiles);
-    host.writeMultipleFiles({
-      'src/app/app.component.ts': `
-        import { Component, SystemJsNgModuleLoader } from '@angular/core';
-
-        @Component({
-          selector: 'app-root',
-          templateUrl: './app.component.html',
-          styleUrls: ['./app.component.css'],
-        })
-        export class AppComponent {
-          title = 'app';
-          constructor(loader: SystemJsNgModuleLoader) {
-            // Module will be split at build time and loaded when requested below
-            loader.load('src/app/lazy/lazy.module#LazyModule')
-              .then((factory) => { /* Use factory here */ });
-          }
-        }`,
-    });
-    host.replaceInFile('src/tsconfig.app.json', `"module": "es2015"`, `"module": "esnext"`);
-    addLazyLoadedModulesInTsConfig(host, lazyModuleFiles);
-
-    const { files } = await browserBuild(architect, host, target, {
-      lazyModules: ['src/app/lazy/lazy.module'],
-    });
-    expect(files['src-app-lazy-lazy-module.js']).not.toBeUndefined();
-  });
-
-  it(`supports extra lazy modules array in AOT`, async () => {
-    host.writeMultipleFiles(lazyModuleFiles);
-    host.writeMultipleFiles({
-      'src/app/app.component.ts': `
-        import { Component, SystemJsNgModuleLoader } from '@angular/core';
-
-        @Component({
-          selector: 'app-root',
-          templateUrl: './app.component.html',
-          styleUrls: ['./app.component.css'],
-        })
-        export class AppComponent {
-          title = 'app';
-          constructor(loader: SystemJsNgModuleLoader) {
-            // Module will be split at build time and loaded when requested below
-            loader.load('src/app/lazy/lazy.module#LazyModule')
-              .then((factory) => { /* Use factory here */ });
-          }
-        }`,
-    });
-    host.replaceInFile('src/tsconfig.app.json', `"module": "es2015"`, `"module": "esnext"`);
-    addLazyLoadedModulesInTsConfig(host, lazyModuleFiles);
-    const { files } = await browserBuild(architect, host, target, {
-      lazyModules: ['src/app/lazy/lazy.module'],
-      aot: true,
-    });
-
-    if (!veEnabled) {
-      const data = await files['src-app-lazy-lazy-module.js'];
-      expect(data).not.toBeUndefined('Lazy module output bundle does not exist');
-      expect(data).toContain('LazyModule.ɵmod');
-    } else {
-      expect(files['src-app-lazy-lazy-module-ngfactory.js']).not.toBeUndefined();
-    }
-  });
 });
diff --git a/packages/angular_devkit/build_angular/src/browser/specs/no-entry-module_spec.ts b/packages/angular_devkit/build_angular/src/browser/specs/no-entry-module_spec.ts
@@ -27,22 +27,4 @@ describe('Browser Builder no entry module', () => {
 
     await browserBuild(architect, host, target, { baseHref: '/myUrl' });
   });
-
-  it('reports warning when no bootstrap code', async () => {
-    if (!veEnabled) {
-      pending('Does not apply to Ivy.');
-
-      return;
-    }
-
-    host.replaceInFile('src/main.ts', /./g, '');
-    host.appendToFile('src/main.ts', `import './app/app.module';`);
-
-    const logger = new logging.Logger('');
-    const logs: string[] = [];
-    logger.subscribe(e => logs.push(e.message));
-
-    await browserBuild(architect, host, target, { baseHref: '/myUrl' }, { logger });
-    expect(logs.join().includes('Lazy routes discovery is not enabled')).toBe(true);
-  });
 });
diff --git a/packages/angular_devkit/build_angular/src/server/schema.json b/packages/angular_devkit/build_angular/src/server/schema.json
@@ -228,15 +228,6 @@
       "description": "Run the TypeScript type checker in a forked process.",
       "default": true
     },
-    "lazyModules": {
-      "description": "List of additional NgModule files that will be lazy loaded. Lazy router modules will be discovered automatically.",
-      "type": "array",
-      "items": {
-        "type": "string"
-      },
-      "x-deprecated": "'SystemJsNgModuleLoader' is deprecated, and this is part of its usage. Use 'import()' syntax instead.",
-      "default": []
-    },
     "watch": {
       "type": "boolean",
       "description": "Run build when files change.",
diff --git a/packages/angular_devkit/build_angular/src/test-utils.ts b/packages/angular_devkit/build_angular/src/test-utils.ts
@@ -147,7 +147,7 @@ export const lazyModuleFiles: { [path: string]: string } = {
   `,
 };
 
-export const lazyModuleStringImport: { [path: string]: string } = {
+export const lazyModuleFnImport: { [path: string]: string } = {
   'src/app/app.module.ts': `
     import { BrowserModule } from '@angular/platform-browser';
     import { NgModule } from '@angular/core';
@@ -162,19 +162,12 @@ export const lazyModuleStringImport: { [path: string]: string } = {
       imports: [
         BrowserModule,
         RouterModule.forRoot([
-          { path: 'lazy', loadChildren: './lazy/lazy.module#LazyModule' }
+          { path: 'lazy', loadChildren: () => import('./lazy/lazy.module').then(m => m.LazyModule) }
         ])
       ],
       providers: [],
       bootstrap: [AppComponent]
     })
     export class AppModule { }
-  `,
-};
-
-export const lazyModuleFnImport: { [path: string]: string } = {
-  'src/app/app.module.ts': lazyModuleStringImport['src/app/app.module.ts'].replace(
-    `loadChildren: './lazy/lazy.module#LazyModule'`,
-    `loadChildren: () => import('./lazy/lazy.module').then(m => m.LazyModule)`,
-  ),
+`,
 };
diff --git a/packages/angular_devkit/build_angular/src/utils/build-options.ts b/packages/angular_devkit/build_angular/src/utils/build-options.ts
@@ -71,8 +71,6 @@ export interface BuildOptions {
   scripts: ExtraEntryPoint[];
   styles: ExtraEntryPoint[];
   stylePreprocessorOptions?: { includePaths: string[] };
-  /** @deprecated SystemJsNgModuleLoader is deprecated, and this is part of its usage. */
-  lazyModules: string[];
   platform?: 'browser' | 'server';
   fileReplacements: NormalizedFileReplacement[];
 
diff --git a/packages/angular_devkit/build_angular/src/utils/normalize-builder-schema.ts b/packages/angular_devkit/build_angular/src/utils/normalize-builder-schema.ts
@@ -59,7 +59,6 @@ export function normalizeBrowserSchema(
         && options.stylePreprocessorOptions.includePaths
         || [],
     },
-    lazyModules: options.lazyModules || [],
     // Using just `--poll` will result in a value of 0 which is very likely not the intention
     // A value of 0 is falsy and will disable polling rather then enable
     // 500 ms is a sensible default in this case
diff --git a/packages/angular_devkit/build_angular/src/webpack/configs/common.ts b/packages/angular_devkit/build_angular/src/webpack/configs/common.ts
@@ -503,8 +503,7 @@ export function getCommonConfig(wco: WebpackConfigOptions): Configuration {
     plugins: [
       // Always replace the context for the System.import in angular/core to prevent warnings.
       // https://github.com/angular/angular/issues/11580
-      // With VE the correct context is added in @ngtools/webpack, but Ivy doesn't need it at all.
-      new ContextReplacementPlugin(/\@angular(\\|\/)core(\\|\/)/),
+      new ContextReplacementPlugin(/\@angular(\\|\/)core(\\|\/)/, projectRoot, {}),
       new DedupeModuleResolvePlugin({ verbose: buildOptions.verbose }),
       ...extraPlugins,
     ],
diff --git a/packages/angular_devkit/build_angular/src/webpack/configs/typescript.ts b/packages/angular_devkit/build_angular/src/webpack/configs/typescript.ts
@@ -36,11 +36,6 @@ function canUseIvyPlugin(wco: WebpackConfigOptions): boolean {
     return false;
   }
 
-  // Lazy modules option uses the deprecated string format for lazy routes
-  if (wco.buildOptions.lazyModules && wco.buildOptions.lazyModules.length > 0) {
-    return false;
-  }
-
   return true;
 }
 
@@ -131,27 +126,15 @@ function _createAotPlugin(
     compilerOptions.enableIvy = false;
   }
 
-  const additionalLazyModules: { [module: string]: string } = {};
-  if (buildOptions.lazyModules) {
-    for (const lazyModule of buildOptions.lazyModules) {
-      additionalLazyModules[lazyModule] = path.resolve(
-        root,
-        lazyModule,
-      );
-    }
-  }
-
   let pluginOptions: AngularCompilerPluginOptions = {
     mainPath: path.join(root, buildOptions.main),
     ...i18nFileAndFormat,
     locale: buildOptions.i18nLocale,
     platform: buildOptions.platform === 'server' ? PLATFORM.Server : PLATFORM.Browser,
     missingTranslation: buildOptions.i18nMissingTranslation,
     sourceMap: buildOptions.sourceMap.scripts,
-    additionalLazyModules,
     nameLazyFiles: buildOptions.namedChunks,
     forkTypeChecker: buildOptions.forkTypeChecker,
-    contextElementDependencyConstructor: require('webpack/lib/dependencies/ContextElementDependency'),
     logger: wco.logger,
     directTemplateLoading: true,
     ...options,
@@ -246,12 +229,9 @@ export function getTypescriptWorkerPlugin(wco: WebpackConfigOptions, workerTsCon
     platform: PLATFORM.Browser,
     sourceMap: buildOptions.sourceMap.scripts,
     forkTypeChecker: buildOptions.forkTypeChecker,
-    contextElementDependencyConstructor: require('webpack/lib/dependencies/ContextElementDependency'),
     logger: wco.logger,
     // Run no transformers.
     platformTransformers: [],
-    // Don't attempt lazy route discovery.
-    discoverLazyRoutes: false,
   };
 
   pluginOptions = _pluginOptionsOverrides(buildOptions, pluginOptions);
