javascript - 延迟加载不会在 Angular 中创建 chunk.js

Question

我有一些项目，我想对组件使用延迟加载。在 app.module.ts 文件中，我从导入部分第三条记录中删除了我到不同组件的路由。在我的 app-routing.module.ts 中，我创建了如下所示的 APP_ROUTES:

const APP_ROUTES : Route[] = [
    { 
            path: '', pathMatch: 'full', 
        redirectTo: 'login'
    },
    { 
        path: 'cars', 
        loadChildren: 'app/cars/cars.module#CarsModule' 
    }
];

@NgModule({
        imports: [
            RouterModule.forRoot(APP_ROUTES)
        ],
        exports: [
            RouterModule
        ]
})

我有一个名为 cars 的主文件夹，我将 CarsRoutingModule 从 app.module.ts 粘贴到 中>cars.module.ts(部分导入)。我在我的汽车模块中创建了 ROUTES，如下所示:

const CARS_ROUTES : Route[] = [
    {
        path: '',
        component: <any> CarsComponent,
        children: [
            {
                path: '',
                component: <any>CarsListComponent
            },
            { 
                path: ':id', 
                component: <any>CarDetailsComponent,
                resolve: { car: CarResolve }
            }
        ]
    }
];

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

我觉得还行。好的，所以我有第二个模块 login.module.ts，我将 app.module.ts 中的 LoginRoutingModule 粘贴到 login.module.ts 中(部分导入) .我创建了如下 ROUTES:

const LOGIN_ROUTES : Route[] = [
     { 
         path: 'login', 
         component: <any>LoginComponent,
        }
];

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

而且它看起来也很适合我。我编译我的项目没有错误。我有登录屏幕，所以它很好，但是当我完成登录和密码并进入仪表板时 - 我没有看到像 chunk.js 这样的东西(也进入 Sources 选项卡)，如下所示:

猜猜，但如果我错了请纠正我 - 在 angular 4+ 中我们没有 chunk.js 文件？我检查了其他东西。当我的项目中没有延迟加载时，我的登录站点上有更多模块:

就像我们在左侧看到我的调试器在 ng 文件夹中一样，我有:AppModule、CarsModule、CoreModule、LoginModule , 共享模块。当我在同一个地方添加延迟加载时，我只有 AppModule、CoreModule 和如下所示:

那么现在，我可以确定我的延迟加载工作正常吗？

Answer 1

我知道哪里出了问题。代码非常好，但我使用了 ng serve。当我使用 ng serve --aot(提前)并且我有 cars.module.chunk.js!