Skip to content

Commit eb5d599

Browse files
feat(AoT): Enable AoT with Lazy Loading. Enable Angular CLI support.
Enables AoT compilation support and better Lazy Loading support. When `@ngtools/webpack` is being used, this also enables automatic code splitting + lazy loading. Because `angular-cli` uses `@ngtools/webpack`, this change also enables `angular-cli` support. To use the new feature, define a `Future State` (by appending `.**` to the state name). Give the state a `loadChildren` property which points to a nested NgModule that will be lazy loaded. Use the same syntax that `@ngtools/webpack` expects: `<pathToModule>#<name of export>`. ```js export var futureFooState = { name: 'foo.**', url: '/foo', loadChildren: './foo/foo.module#FooModule' }; ... imports: [ UIRouterModule.forRoot({ states: [ futureFooState ] }), ... ``` In your nested module, add a state named `foo` (without the `.**`). This nested module's `foo` state will replace the `foo.**` Future State (placeholder). ```js export var fooState = { name: 'foo', url: '/foo', resolve: { fooData: fooResolveFn }, onEnter: onEnterFooFn, data: { requiresAuth: true } }; ... imports: [ UIRouterModule.forChild({ states: [ fooState ] }), ... ``` This change works by providing the same DI token as the `@angular/router` which is then analyzed for lazy loading by `@ngtools/webpack`. The `ROUTES` token is deep imported from `@angular/router/src/router_config_loader`. The module's states are provided on the ROUTES token, which enables the webpack tooling to analyze the states, looking for `loadChildren`. When the UMD bundle is built, the ROUTES token is pulled in from `@angular/router` (and duplicated), but should not be used by anything. Because we pull in the token from the `@angular/router` package, we have a temporary dependency on the angular router. This is a temporary hack until the `@ngtools/webpack` project makes itself router-agnostic.
1 parent c2bd3ca commit eb5d599

File tree

1 file changed

+2
-2
lines changed

1 file changed

+2
-2
lines changed

src/uiRouterNgModule.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -10,11 +10,11 @@ import { UIView } from "./directives/uiView";
1010
import { UrlRuleHandlerFn, TargetState, TargetStateDef, UIRouter } from "ui-router-core";
1111
import { _UIROUTER_INSTANCE_PROVIDERS, _UIROUTER_SERVICE_PROVIDERS } from "./providers";
1212

13-
// import { ROUTES } from "@angular/router/src/router_config_loader";
13+
import { ROUTES } from "@angular/router/src/router_config_loader";
1414
/** @hidden */ export const UIROUTER_ROOT_MODULE = new OpaqueToken("UIRouter Root Module");
1515
/** @hidden */ export const UIROUTER_MODULE_TOKEN = new OpaqueToken("UIRouter Module");
1616
/** @hidden */ export const UIROUTER_STATES = new OpaqueToken("UIRouter States");
17-
/** @hidden */ export const ROUTES = UIROUTER_STATES;
17+
// /** @hidden */ export const ROUTES = UIROUTER_STATES;
1818

1919
export function makeRootProviders(module: StatesModule): Provider[] {
2020
return [

0 commit comments

Comments
 (0)