运行时编译器未加载 Angular 8 和惰性模块

Question

我创建了一个新的 Angular 8 项目 @angular/cli -> ng new，添加了一个新的惰性模块，ng serve is工作正常，但是使用 ng build --prod 它会引发以下错误：

这是我的app.module.ts

@NgModule({
      declarations: [
        AppComponent
      ],
      imports: [
        BrowserModule,
        AppRoutingModule
      ],
      providers: [],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

这是我的应用-routing.module.ts

const appRoutes: Routes = [
  {
    path: '',
    redirectTo: 'dashboard',
    pathMatch: 'full',
  },
  {
    path: 'dashboard',
    loadChildren: () => import(`./dashboard/dashboard.module`).then(m => m.DashboardModule),
  }
];

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

这是我的 dashboard.module.ts

@NgModule({
  imports: [
    DashboardRoutingModule
  ],
  declarations: [
    DashboardComponent,
  ]
})
export class DashboardModule { }

这是我的仪表板-routing.module.ts

const ROUTES: Routes = [
  {
    path: '',
    component: DashboardComponent
  }
];

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

这是我的tsconfig.json（默认）

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  }
}

Answer 1

我想我已经解决了这个问题，问题出在这一行：

loadChildren: () => import(`./dashboard/dashboard.module`)

我用的是反引号，用普通的 single-quote '' 替换它们，效果很好。

Answer 2

这个语法对我有用：

{ path: 'dashboard', loadChildren: './dashboard/dashboard.module#DashboardModule'}

Answer 3

我遇到了同样的问题，并通过将我的 loadchildren 放在一行中解决了这个问题，而且数量不多（因为我的声纳有 120 克拉的限制！）我正在使用 Angular 10

柯：

{
    path: "my-big-page",
    loadChildren: () => import("./pages/path-to-page/path-to-page/path-to-page/" +
    "ppage.module").then(
    m => m.MyPagePageModule),
},

好的：

{
    path: "my-big-page",
    loadChildren: () => import("./pages/path-to-page/path-to-page/path-to-page/ppage.module").then(m => m.MyPagePageModule),
},

导入的字符串必须是严格的字符串！

运行时编译器未加载 Angular 8 和惰性模块

Runtime compiler is not loaded with Angular 8 and lazy module

lazy-loading

angular