feat(compiler-cli): lower loadChildren fields to allow dynamic module paths (#23088)

alxhub · alxhub · commit 550433a128cf · 2018-04-04T08:20:21.000-07:00
Computing the value of loadChildren does not work externally, as the CLI needs to be able to detect the paths referenced to properly set up codesplitting. However, internally, different approaches to codesplitting require hashed module IDs, and the computation of those hashes involves something like: {path: '...', loadChildren: hashFn('module')} ngc should lower loadChildren into an exported constant in that case. This will never break externally, because loadChildren is always a string externally, and a string won't get lowered. PR Close #23088
diff --git a/packages/compiler-cli/src/transformers/program.ts b/packages/compiler-cli/src/transformers/program.ts
@@ -69,7 +69,7 @@ const MAX_FILE_COUNT_FOR_SINGLE_FILE_EMIT = 20;
 /**
  * Fields to lower within metadata in render2 mode.
  */
-const LOWER_FIELDS = ['useValue', 'useFactory', 'data', 'id'];
+const LOWER_FIELDS = ['useValue', 'useFactory', 'data', 'id', 'loadChildren'];
 
 /**
  * Fields to lower within metadata in render3 mode.
diff --git a/packages/compiler-cli/test/BUILD.bazel b/packages/compiler-cli/test/BUILD.bazel
@@ -69,6 +69,7 @@ jasmine_node_test(
         "//packages/common:npm_package",
         "//packages/core:npm_package",
         "//packages/platform-browser:npm_package",
+        "//packages/router:npm_package",
     ],
     deps = [
         ":ngc_lib",
diff --git a/packages/compiler-cli/test/ngc_spec.ts b/packages/compiler-cli/test/ngc_spec.ts
@@ -869,6 +869,40 @@ describe('ngc transformer command-line', () => {
         expect(mymoduleSource).toMatch(/ɵ0 = .*'test'/);
       });
 
+      it('should lower loadChildren', () => {
+        write('mymodule.ts', `
+          import {Component, NgModule} from '@angular/core';
+          import {RouterModule} from '@angular/router';
+          
+          export function foo(): string {
+            console.log('side-effect');
+            return 'test';
+          }
+
+          @Component({
+            selector: 'route',
+            template: 'route',
+          })
+          export class Route {}
+
+          @NgModule({
+            declarations: [Route],
+            imports: [
+              RouterModule.forRoot([
+                {path: '', pathMatch: 'full', component: Route, loadChildren: foo()}
+              ]),
+            ]
+          })
+          export class MyModule {}
+        `);
+        expect(compile()).toEqual(0);
+
+        const mymodulejs = path.resolve(outDir, 'mymodule.js');
+        const mymoduleSource = fs.readFileSync(mymodulejs, 'utf8');
+        expect(mymoduleSource).toContain('loadChildren: ɵ0');
+        expect(mymoduleSource).toMatch(/ɵ0 = .*foo\(\)/);
+      });
+
       it('should be able to lower supported expressions', () => {
         writeConfig(`{
           "extends": "./tsconfig-base.json",
diff --git a/packages/compiler/src/aot/static_reflector.ts b/packages/compiler/src/aot/static_reflector.ts
@@ -28,7 +28,7 @@ const IGNORE = {
 
 const USE_VALUE = 'useValue';
 const PROVIDE = 'provide';
-const REFERENCE_SET = new Set([USE_VALUE, 'useFactory', 'data', 'id']);
+const REFERENCE_SET = new Set([USE_VALUE, 'useFactory', 'data', 'id', 'loadChildren']);
 const TYPEGUARD_POSTFIX = 'TypeGuard';
 const USE_IF = 'UseIf';
 
