Angular7：延迟加载不创建块答案

【问题标题】：Angular7: Lazy loading not creating chunksAngular7：延迟加载不创建块
【发布时间】：2019-09-18 17:53:09
【问题描述】：

我正在使用 Angular7，并且我正在使用新语法，即 loadChildren 用于延迟加载模块。但是当我提供我的应用程序并在浏览器中签入时，我发现它没有创建任何块。

下面是我的应用路由

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

const routes: Routes = [
  { path: '', loadChildren: './layout/layout.module#LayoutModule' },
  { path: 'auth', loadChildren: './auth/auth.module#AuthModule' },
  { path: 'not-found', loadChildren: './not-found/not-found.module#NotFoundModule' },
  { path: '**', redirectTo: 'not-found' }
];

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

下面是我的 App 模块我

mport { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

// imports for internationalization i18n
import { HttpClientModule } from '@angular/common/http';
import { LanguageTranslationModule } from './language-translation/language-translation.module';

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

【问题讨论】：

实际上它确实创建了块，layout-module 和auth-module，你的图片中清楚地显示了块。

标签： javascript angular lazy-loading angular7 angular-load-children

【解决方案1】：

为什么要创建延迟加载的布局模块？延迟加载功能模块的整个想法不是在后台或请求时预加载或加载其他功能模块时快速向用户显示首页吗？

如果您有一个布局模块，从一开始您就至少有 3 个请求：1 个用于您的应用，一个用于布局，最有可能一个用于在布局内呈现的页面。

您可以提高性能以构建预先加载的模块布局，添加到 AppModule 中，然后使用延迟加载功能模块在布局内路由组件。此外，主页应该包含在 AppModule 中，以便快速呈现，而不是等待浏览器下载延迟加载模块来呈现。

顺便说一句：我已经看到，如果我使用由 AppModule 中的功能模块或 AppModule 中包含的组件导出的组件，那么该功能模块将没有自己的块文件。每个延迟加载功能模块应该是自包含的，不应将组件导出到其他模块。如果你这样做，你可能需要更多地打破你的模块，以便能够在模块之间共享一些组件/提供程序。

另外，在功能模块之间共享提供程序时要小心，因为您有子注入器，您最终会得到多个单例实例，每个功能模块一个。要共享提供程序，您应该在共享模块中实现 .forRoot 和 .forChild。

【讨论】：

【解决方案2】：

如图所示，确实创建了块。

并且未找到的模块没有出现，这是正常的。

【讨论】：

是不是 Angular 改变了对块的命名？