Types of property 'loadChildren' are incompatible.
MYXOMOPX opened this issue · comments
Trying to lazyLoad module, i'm got compile error caused by incopatible types.
current state:
{
name: "lazy.**",
url: "/lazy",
loadChildren: "../lazy/lazy.module#LazyModule"
}
And i'm got this compilation error
Type '{ name: string; url: string; loadChildren: () => Promise<{}>; component?: undefined; }' is not assignable to type 'Ng2StateDeclaration'.
Types of property 'loadChildren' are incompatible.
Type '() => Promise<{}>' is not assignable to type 'NgModuleToLoad'.
Type '() => Promise<{}>' is not assignable to type 'ModuleTypeCallback'.
Type 'Promise<{}>' is not assignable to type 'Type<any> | Promise<Type<any>>'.
Type 'Promise<{}>' is not assignable to type 'Promise<Type<any>>'.
Type '{}' is not assignable to type 'Type<any>'.
Property 'apply' is missing in type '{}'.
It's not throws if i will directly insert function to loadChildrent and manual cast return type to Promise
{
name: "lazy.**",
url: "/lazy",
loadChildren: function() {
return <Promise<any>>new Promise(function (resolve, reject) {
(require as any).ensure([], function (require: any) {
resolve(require('..\\lazy\\lazy.module')['LazyModule']);
}, function(e: any) {
reject({ loadChunkError: true, details: e });
});})
}
}
How to fix this?
libraries:
ts-loader 4.5.0
typescript 3.0.1
angular-router-loader 0.8.5
UPD: one more way to fix is cast with "as" keyword
loadChildren: "../lazy/lazy.module#LazyModule" as () => Promise<any>