feat: Ivy compatibility (#2074)

docs/app/app.routes.ts

@@ -9,15 +9,15 @@ import { Routes } from '@angular/router';
 export const routes: Routes = [
  {
  path: '',
- loadChildren: './home/home.module#NgdHomeModule',
+ loadChildren: () => import('./home/home.module').then(m => m.NgdHomeModule),
  },
  {
  path: 'docs',
- loadChildren: './documentation/documentation.module#NgdDocumentationModule',
+ loadChildren: () => import('./documentation/documentation.module').then(m => m.NgdDocumentationModule),
  },
  {
  path: 'example',
- loadChildren: './example/example.module#NgdExampleModule',
+ loadChildren: () => import('./example/example.module').then(m => m.NgdExampleModule),
  },
  {
  path: '**',

docs/app/example/example-routing.module.ts

@@ -17,7 +17,7 @@ export const routes: Routes = [
  children: [
  {
  path: '',
- loadChildren: '../../../src/playground/playground.module#PlaygroundModule',
+ loadChildren: () => import('../../../src/playground/playground.module').then(m => m.PlaygroundModule),
  },
  {
  path: '**',

docs/tsconfig.app.json

@@ -12,7 +12,7 @@
  ],
  "outDir": "../out-tsc/app",
  "target": "es5",
- "module": "es2015",
+ "module": "esnext",
  "baseUrl": ".",
  "types": [],
  "paths": {

schematics/playground-components/index.ts

@@ -22,7 +22,7 @@ import {
  isComponentRoute,
  isLazyRoute,
  isRoutingModule,
- lazyRoutePathToFilePath,
+ lazyModuleImportToFilePath,
  removePropsQuotes,
  singleQuotes,
  splitClassName,
@@ -119,8 +119,8 @@ function getLazyModuleRoutes(
 ): ComponentLink[] {
  const lazyModule = getRouteLazyModule(route);
  if (lazyModule) {
- const lazyModulePath = lazyModule && trimQuotes(lazyModule.initializer.getText());
- const moduleDirPath = dirname(lazyRoutePathToFilePath(lazyModulePath) as Path) as PathFragment;
+ const lazyModuleImport = lazyModule.initializer.getText();
+ const moduleDirPath = dirname(lazyModuleImportToFilePath(lazyModuleImport) as Path) as PathFragment;
  return findRoutesInDir(tree, routingModuleDir.dir(moduleDirPath));
  }
  return [];

schematics/playground-module/add-to-modules.ts

@@ -24,7 +24,7 @@ import {
  getDirectivesFromDir,
  getFeatureModuleFromDir,
  getRoutingModuleFromDir,
- generateLazyModulePath,
+ generateLazyModuleImport,
  routePredicatesFromPath,
  applyReplaceChange,
  findRoutingModule,
@@ -209,8 +209,8 @@ function addModuleRoute(
  }
 
  const moduleClassName = (moduleDeclaration.name as ts.Identifier).getText();
- const lazyModulePath = generateLazyModulePath(routingModulePath, modulePath, moduleClassName);
- const loadChildren = `loadChildren: '${lazyModulePath}'`;
+ const lazyModuleImport = generateLazyModuleImport(routingModulePath, modulePath, moduleClassName);
+ const loadChildren = `loadChildren: ${lazyModuleImport}`;
  addObjectProperty(tree, getSourceFile(tree, routingModulePath), route, loadChildren);
 }
 

schematics/utils/path.ts

@@ -6,6 +6,7 @@
 
 import { parse } from 'path';
 import { NormalizedSep, Path, relative, dirname, join, normalize, basename, PathFragment } from '@angular-devkit/core';
+import { SchematicsException } from '@angular-devkit/schematics';
 
 export function removeExtension(filePath: Path): string {
  return parse(filePath).name;
@@ -40,8 +41,12 @@ export function importPath(from: Path, to: Path): string {
  return generateCurrentDirImport(join(relativePath, basename(to)));
 }
 
-export function lazyRoutePathToFilePath(lazyRoutePath: string): string {
- const path = lazyRoutePath.slice(0, lazyRoutePath.indexOf('#'));
+export function lazyModuleImportToFilePath(lazyRoutePath: string): string {
+ const matches = /import\('(.+)'\)/m.exec(lazyRoutePath);
+ if (matches) {
+ const path = matches[1];
+ return path + '.ts' as PathFragment;
+ }
 
- return path + '.ts' as PathFragment;
+ throw new SchematicsException(`Can't find lazy module import in ${lazyRoutePath}`);
 }

schematics/utils/routing.ts

@@ -116,9 +116,9 @@ export function generateRoute(...routeFields: string[]) {
 
 export type RoutePredicate = (route: ts.ObjectLiteralExpression) => boolean;
 
-export function generateLazyModulePath(from: Path, to: Path, moduleClassName: string): string {
+export function generateLazyModuleImport(from: Path, to: Path, moduleClassName: string): string {
  const path = normalize(importPath(from, to));
- return `./${dirname(path)}/${basename(path)}#${moduleClassName}`;
+ return `() => import('./${dirname(path)}/${basename(path)}').then(m => m.${moduleClassName})`;
 }
 
 /**
@@ -190,8 +190,8 @@ export function addRootRoute(tree: Tree, targetFile: Path): void {
  const isLayout = isLayoutPath(targetFile);
  const baseModulePath = isLayout ? LAYOUT_MODULE_PATH : NO_LAYOUT_MODULE_PATH ;
  const baseModuleClass = isLayout ? LAYOUT_MODULE_CLASS : NO_LAYOUT_MODULE_CLASS ;
- const lazyModulePath = generateLazyModulePath(PLAYGROUND_ROUTING_MODULE_PATH, baseModulePath, baseModuleClass);
- const routeString = generatePathRoute('', `loadChildren: '${lazyModulePath}'`);
+ const lazyModuleImport = generateLazyModuleImport(PLAYGROUND_ROUTING_MODULE_PATH, baseModulePath, baseModuleClass);
+ const routeString = generatePathRoute('', `loadChildren: ${lazyModuleImport}`);
  addRoute(tree, PLAYGROUND_ROUTING_MODULE_PATH, routesArray, routeString);
 }
 
@@ -365,9 +365,9 @@ export function componentRoutePredicate(componentClass: string, route: ts.Object
  return !!component && component.initializer.getText() === componentClass;
 }
 
-export function lazyModulePredicate(lazyModulePath: string, route: ts.ObjectLiteralExpression): boolean {
+export function lazyModulePredicate(lazyModuleImport: string, route: ts.ObjectLiteralExpression): boolean {
  const loadChildren = getRouteLazyModule(route);
- return !!loadChildren && loadChildren.initializer.getText() === `'${lazyModulePath}'`;
+ return !!loadChildren && loadChildren.initializer.getText() === lazyModuleImport;
 }
 
 export function baseComponentPredicate(modulePath: Path): RoutePredicate {
@@ -379,9 +379,9 @@ export function rootRoutePredicate(modulePath: Path): RoutePredicate {
  const isLayout = isLayoutPath(modulePath);
  const baseModulePath = isLayout ? LAYOUT_MODULE_PATH : NO_LAYOUT_MODULE_PATH;
  const baseModuleClass = isLayout ? LAYOUT_MODULE_CLASS : NO_LAYOUT_MODULE_CLASS;
- const lazyModulePath = generateLazyModulePath(PLAYGROUND_ROUTING_MODULE_PATH, baseModulePath, baseModuleClass);
+ const lazyModuleImport = generateLazyModuleImport(PLAYGROUND_ROUTING_MODULE_PATH, baseModulePath, baseModuleClass);
 
- return (route: ts.ObjectLiteralExpression) => lazyModulePredicate(lazyModulePath, route);
+ return (route: ts.ObjectLiteralExpression) => lazyModulePredicate(lazyModuleImport, route);
 }
 
 export function isLazyRoute(route: ts.ObjectLiteralExpression): boolean {

src/app/app.module.ts

@@ -28,7 +28,7 @@ import { NbEvaIconsModule } from '@nebular/eva-icons';
  RouterModule.forRoot([
  {
  path: '',
- loadChildren: '../playground/playground.module#PlaygroundModule',
+ loadChildren: () => import('../playground/playground.module').then(m => m.PlaygroundModule),
  },
  ], { useHash: true }),
  NbThemeModule.forRoot(),

src/framework/date-fns/date-fns.module.ts

@@ -15,7 +15,7 @@ const dateFnsServiceProvider = { provide: NbDateService, useClass: NbDateFnsDate
  providers: [ dateFnsServiceProvider ],
 })
 export class NbDateFnsDateModule {
- static forRoot(options: Partial<NbDateFnsOptions>): ModuleWithProviders {
+ static forRoot(options: Partial<NbDateFnsOptions>): ModuleWithProviders<NbDateFnsDateModule> {
  return {
  ngModule: NbDateFnsDateModule,
  providers: [
@@ -25,7 +25,7 @@ export class NbDateFnsDateModule {
  };
  }
 
- static forChild(options: Partial<NbDateFnsOptions>): ModuleWithProviders {
+ static forChild(options: Partial<NbDateFnsOptions>): ModuleWithProviders<NbDateFnsDateModule> {
  return {
  ngModule: NbDateFnsDateModule,
  providers: [

src/framework/theme/components/cdk/adapter/block-scroll-strategy-adapter.ts

@@ -29,6 +29,7 @@ export class NbBlockScrollStrategyAdapter extends BlockScrollStrategy {
  }
 }
 
+@Injectable()
 export class NbScrollStrategyOptions extends ScrollStrategyOptions {
  constructor(protected scrollService: NbLayoutScrollService,
  protected scrollDispatcher: ScrollDispatcher,

src/framework/theme/components/cdk/overlay/overlay-container.ts

@@ -25,7 +25,12 @@ export interface NbRenderableContainer {
  renderContent();
 }
 
-export abstract class NbPositionedContainer {
+@Component({
+ template: '',
+})
+// @breaking-change @5.0.0 Rename to NbPositionedContainerComponent and enable ts lint
+// tslint:disable-next-line
+export class NbPositionedContainer {
  @Input() position: NbPosition;
 
  @HostBinding('class.nb-overlay-top')

src/framework/theme/components/cdk/overlay/overlay.module.ts

@@ -4,7 +4,7 @@ import { NbSharedModule } from '../../shared/shared.module';
 import { NbA11yModule } from '../a11y/a11y.module';
 import { NbCdkMappingModule } from './mapping';
 import { NbPositionBuilderService } from './overlay-position';
-import { NbOverlayContainerComponent } from './overlay-container';
+import { NbOverlayContainerComponent, NbPositionedContainer } from './overlay-container';
 import { NbOverlayService } from './overlay-service';
 import { NbCdkAdapterModule } from '../adapter/adapter.module';
 import { NbPositionHelper } from './position-helper';
@@ -16,7 +16,10 @@ import { NbTriggerStrategyBuilderService } from './overlay-trigger';
  NbCdkMappingModule,
  NbSharedModule,
  ],
- declarations: [NbOverlayContainerComponent],
+ declarations: [
+ NbPositionedContainer,
+ NbOverlayContainerComponent,
+ ],
  exports: [
  NbCdkMappingModule,
  NbCdkAdapterModule,