Every time I attempt to compile my Angular 8 Ionic 5 App using the AOT compiler option, I encounter this specific error:
ERROR in Cannot read properties of undefined (reading 'loadChildren')
[ERROR] An error occurred while running subprocess ng.
In my App, there are 3 different user types. The application functions properly when compiling without AOT enabled. The user type is determined only during the login process.
The modules can be found in the following directories within the project structure:
- src/app/myapp/home-end-user
- src/app/myapp/home-company-user
- src/app/myapp/home-agent-user
This function is responsible for redirecting to a specific component based on the logged-in user's type:
export function configHomeRoutes(authService: AuthService) {
let route: Routes;
if (authService.currentRol.user_type === 'end_user') {
route = [{
path: '',
loadChildren: () => import('../home-end-user/home-end-user.module').then(m => m.HomeEndUserPageModule),
}];
} else if (authService.currentRol.user_type === 'agent_user') {
route = [{
path: '',
loadChildren: () => import('../home-agent-user/home-agent-user.module').then(m => m.HomeAgentUserPageModule),
}];
} else if (authService.currentRol.user_type === 'company_user') {
route = [{
path: '',
loadChildren: () => import('../home-company-user/home-company-user.module').then(m => m.HomeCompanyUserPageModule),
}];
}
return route;
}
Lastly, this snippet shows the contents of the tsconfig.json file:
{
"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"
]
},
"angularCompilerOptions": {
"fullTemplateTypeCheck": true,
"strictInjectionParameters": true
}
}
I have attempted replacing arrow function imports with string imports, yet the app consistently fails to locate the required module.