Routing Module Build Error Angular 8.3.x #8147

jackmcelhinney created 2 months ago

ABP Framework version: v8.3.2
UI Type: Angular
Database System: EF Core SQL Server
Tiered (for MVC) or Auth Server Separated (for Angular): no

Hello. After upgrading to 8.3.2 (also with 8.3.1), I get the following error in the routing module:

Error: src/app/app-routing.module.ts:190:29 - error TS2322: Type 'Promise<Type<any> | NgModuleFactory<...> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes> | NgModuleFactory<...>>' is not assignable to type 'Type<any> | NgModuleFactory<any> | Routes | Observable<Type<any> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes>> | Promise<...>'.
  Type 'Promise<Type<any> | NgModuleFactory<...> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes> | NgModuleFactory<...>>' is not assignable to type 'Promise<Type<any> | NgModuleFactory<any> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes>>'.
    Type 'Type<any> | NgModuleFactory<...> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes> | NgModuleFactory<...>' is not assignable to type 'Type<any> | NgModuleFactory<any> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes>'.
      Type 'NgModuleFactory<AccountPublicModule>' is not assignable to type 'Type<any> | NgModuleFactory<any> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes>'.
        Type 'NgModuleFactory<AccountPublicModule>' is not assignable to type 'NgModuleFactory<any>'.
          The types of 'create(...).componentFactoryResolver.resolveComponentFactory(...).inputs' are incompatible between these types.
            Type '{ propName: string; templateName: string; transform?: (value: any) => any; }[]' is not assignable to type '{ propName: string; templateName: string; transform?: (value: any) => any; isSignal: boolean; }[]'.
              Property 'isSignal' is missing in type '{ propName: string; templateName: string; transform?: (value: any) => any; }' but required in type '{ propName: string; templateName: string; transform?: (value: any) => any; isSignal: boolean; }'.

190         loadChildren: () => import('@volo/abp.ng.account/public').then(m => m.AccountPublicModule.forLazy())
                                ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  node_modules/@angular/core/index.d.ts:1859:9
    1859         isSignal: boolean;
                 ~~~~~~~~
    'isSignal' is declared here.
  node_modules/@angular/router/index.d.ts:1372:44
    1372 export declare type LoadChildrenCallback = () => Type<any> | NgModuleFactory<any> | Routes | Observable<Type<any> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes>> | Promise<NgModuleFactory<any> | Type<any> | Routes | DefaultExport<Type<any>> | DefaultExport<Routes>>;
                                                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    The expected type comes from the return type of this signature.

The module is imported in my routing module the same as the startup template:

{
    path: 'account',
    loadChildren: () => import('@volo/abp.ng.account/public').then(m => m.AccountPublicModule.forLazy())
},

Using Angular ~18.1.0.

"dependencies": {
    "@abp/ng.components": "8.3.2",
    "@abp/ng.core": "8.3.2",
    "@abp/ng.oauth": "8.3.2",
    "@abp/ng.setting-management": "8.3.2",
    "@abp/ng.theme.shared": "8.3.2",
    "@angular/animations": "~18.1.0",
    "@angular/common": "~18.1.0",
    "@angular/compiler": "~18.1.0",
    "@angular/core": "~18.1.0",
    "@angular/forms": "~18.1.0",
    "@angular/localize": "~18.1.0",
    "@angular/platform-browser": "~18.1.0",
    "@angular/platform-browser-dynamic": "~18.1.0",
    "@angular/router": "~18.1.0",
    ...
    "@volo/abp.commercial.ng.ui": "8.3.2",
    "@volo/abp.ng.account": "8.3.2",
    "@volo/abp.ng.audit-logging": "8.3.2",
    "@volo/abp.ng.gdpr": "8.3.2",
    "@volo/abp.ng.identity": "8.3.2",
    "@volo/abp.ng.language-management": "8.3.2",
    "@volo/abp.ng.openiddictpro": "8.3.2",
    "@volo/abp.ng.saas": "8.3.2",
    "@volo/abp.ng.text-template-management": "8.3.2",
    "@volosoft/abp.ng.theme.lepton-x": "3.3.1",
    ...
    "rxjs": "7.8.1",
    "tslib": "~2.8.0",
    "zone.js": "~0.14.10"
},
"devDependencies": {
    "@abp/ng.schematics": "8.3.2",
    "@angular-devkit/build-angular": "~18.1.0",
    "@angular-eslint/builder": "~18.1.0",
    "@angular-eslint/eslint-plugin": "~18.1.0",
    "@angular-eslint/eslint-plugin-template": "~18.1.0",
    "@angular-eslint/schematics": "~18.1.0",
    "@angular-eslint/template-parser": "~18.1.0",
    "@angular/cli": "~18.1.0",
    "@angular/compiler-cli": "~18.1.0",
    "@angular/language-service": "~18.1.0",
    "@types/node": "~20.16.14",
    "@typescript-eslint/eslint-plugin": "~8.9.0",
    "@typescript-eslint/parser": "~8.9.0",
    ...
    "ng-packagr": "~18.1.0",
    "ngxs-schematic": "^1.1.9",
    "protractor": "^7.0.0",
    "ts-node": "~10.9.2",
    "tslint": "^6.1.3",
    "typescript": "~5.5.4"
}

I have tried, deleting yarn.lock/node_modules but no luck. Any ideas?

Thanks

2 Answer(s)