带Ionic-app-scripts的Angular AOT延迟加载模块(webpack)

Question

我们正在尝试使用ionic- app -scripts从相同的代码库创建一个angular (4)和ionic (3)应用程序。我们有一个问题，即生产版本不能用于angular (使用带有延迟加载组件的angular-router )。

有没有人成功地集成了AOT的webpack加载器和ionic-app-scripts？我们正在尝试使用ng-router-loader并将其添加到加载器链中，但如果加载器位于index.js 29:14的ng-router-loader的加载器链的下游太远，则会出现运行时编译器不存在错误或webpack构建错误

Module build failed: TypeError: this.call is not a function 

Answer 1

据我所知，没有为从angular routing加载惰性功能模块提供默认设置。仅适用于ionic格式的页面。

我们还在离子3应用程序中使用angular (5)路由，该应用程序具有嵌套的功能模块，这些模块应该是延迟加载的。但这不适用于默认的ionic-app-scripts配置，我们认为深入研究它太耗时了。

从ionic 4开始，他们将只使用ionic-cli，而不使用ionic-app-scripts配置。正因为如此，我建议等到ionic 4之后再升级，现在就像我们做的那样，使用一个完整的捆绑包(没有延迟加载，但带有最小化和AOT)。

为了与我们的功能模块分离一起工作，我们必须从功能模块中导出路由并将它们合并，如下所示：

@NgModule({
    imports: [
        RouterModule.forChild([
            {
                path: DashboardRoutingRouteNames.Dashboard,
                component: DashboardComponent,
                children: [
                    {
                        path: '',
                        redirectTo: DashboardRoutingRouteNames.Overview,
                        pathMatch: 'full'
                    },
                    /**
                     * This is a workaround because AOT is not working correct with ionic 3 (default ionic-app-scripts configuration) and lazy loaded feature modules of angular.
                     */
                    dashboardOverviewRoutes,
                    dashboardAccountRoutes
                ]
            }
        ])
    ],
    exports: [
        RouterModule
    ]
})
export class DashboardRoutingModule {
}

export const dashboardAccountRoutes: Route = {
    path: DashboardRoutingRouteNames.Account,
    children: [
        {
            path: '',
            component: AccountComponent
        }
    ]
};