2

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

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

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

1 回答 1

0

据我所见，没有为使用角度路由加载惰性功能模块提供默认值。仅适用于离子页面。

我们还在 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
        }
    ]
};
于 2018-09-11T08:13:41.800 回答