来自模块的 Angular 5 loadChildren 路由 -> 未找到 NgModule 元数据

Question

我使用以下工具:

• Angular 5.2
• Angular -cli 1.7.3
• ng-packagr 2.4.1

在我的 Angular 5 主应用程序中，我有一个 CoreModule 和一个 DashboardModule。在 CoreModule 中，我有以下路线:

import {RouterModule, Routes} from "@angular/router";
import {NgModule} from "@angular/core";
import {LoginComponent} from "./login/login.component";
import {AuthGuardService} from "./services/auth-guard.service";

const routes: Routes = [
  {
    path: '',
    component: LoginComponent
  },
  {
    path: 'dashboard',
    canActivate: [AuthGuardService],
    loadChildren: '@modules/dashboard/dashboard.module#DashboardModule'
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})

export class CoreRoutingModule {}

当我在我的主应用程序中工作时没问题，但是如果我将 CoreModule 和 DashboardModule 打包在一个带有 ng-packagr 的库中，当我在另一个应用程序中将它们用作 NPM 包时，我在启动时遇到以下错误:

ERROR in No NgModule metadata found for 'DashboardModule'.

有什么想法吗？

Answer 1

更新

Angular 现在支持 src 文件夹外的延迟加载模块。您应该使用 lambda 语法(现在是一种模式)和 JS 导入。

const routes: Routes = [
  {
    path: '',
    loadChildren: async () => (await import('./sdk/sdk.module')).SdkModule
  },
  {
    path: 'layouts',
    loadChildren: () => import('@my-lib/layouts').then(m => m.LayoutModule)
  }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

旧答案

我遇到了同样的问题。 这是 Angular-cli 上的未决问题。 Angular-cli 不能(今天是 unitl)在 src 文件夹之外“延迟加载”模块。换句话说，您不能从 node_modules 延迟加载。

有一个 Unresolved 问题解释了问题和解决方法。

https://github.com/angular/angular-cli/issues/6373

周围的工作是将您的惰性模块包装在其他本地模块中，然后将本地模块作为惰性模块导入。问题是你应该为每个“外部”模块创建一个代理模块；/另一个问题是你的外部包中不能有“惰性模块”。

dashboard-proxy.module.ts

    @NgModule({
      imports: [
        CommonModule,
        DashboardModule <<---- External Module @pkg/admin/dashboard
      ],
      exports: [
        DashboardModule
      ],
      declarations: []
    })
export class DashboardProxyModule { }

代理路由器路由模块.ts

const routes: Routes = [
  {
    path: 'dashboard',
    loadChildren: 'app/proxy-router/dashboard-proxy/dashboard-proxy.module#DashboardProxyModule' << ---- Proxy
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class ProxyRouterRoutingModule { }