Upgrading to Angular 10 + nebular 6 + Typescript 4.0.2 results in NbColumnDefDirective + NbTreeGridxxxxxDefDirective errors

argupta23 commented 4 years ago

Issue type

I'm submitting a ... (check one with "x")

[ x ] bug report
[ ] feature request

Issue description

Current behavior: Upgrading current project based on Angular 9 + nebular 5 to Angular10 + nebular 6 results in the following errors during compilation.

ERROR in node_modules/@nebular/theme/components/cdk/table/cell.d.ts:35:5 - error TS2610: 'name' is defined as an accessor in class 'CdkColumnDef', but is overridden here in 'NbColumnDefDirective' as an instance property.

35     name: string;
       ~~~~
node_modules/@nebular/theme/components/cdk/table/cell.d.ts:39:5 - error TS2610: 'stickyEnd' is defined as an accessor in class 'CdkColumnDef', but is overridden here in 'NbColumnDefDirective' as an instance property.

39     stickyEnd: boolean;
       ~~~~~~~~~
node_modules/@nebular/theme/components/tree-grid/tree-grid-def.component.d.ts:19:9 - error TS2611: 'columns' is defined as a property in class 'NbRowDefDirective<T>', but is overridden here in 'NbTreeGridRowDefDirective<T>' as an accessor.

19     set columns(value: Iterable<string>);
           ~~~~~~~
node_modules/@nebular/theme/components/tree-grid/tree-grid-def.component.d.ts:34:9 - error TS2611: 'columns' is defined as a property in class 'NbHeaderRowDefDirective', but is overridden here in 'NbTreeGridHeaderRowDefDirective' as an accessor.

34     set columns(value: Iterable<string>);
           ~~~~~~~
node_modules/@nebular/theme/components/tree-grid/tree-grid-def.component.d.ts:49:9 - error TS2611: 'columns' is defined as a property in class 'NbFooterRowDefDirective', but is overridden here in 'NbTreeGridFooterRowDefDirective' as an accessor.

49     set columns(value: Iterable<string>);
           ~~~~~~~

Expected behavior: Upgrade should work seamlessly.

Other information:

npm, node, OS, Browser

node -v v12.18.2
npm -v 6.14.7

Angular, Nebular

    "@angular/animations": "^10.1.0",
    "@angular/common": "^10.1.0",
    "@angular/compiler": "^10.1.0",
    "@angular/core": "^10.1.0",
    "@angular/elements": "^10.1.0",
    "@angular/flex-layout": "^10.0.0-beta.32",
    "@angular/forms": "^10.1.0",
    "@angular/google-maps": "^9.1.0",
    "@angular/material": "^10.2.0",
    "@angular/platform-browser": "^10.1.0",
    "@angular/platform-browser-dynamic": "^10.1.0",
    "@angular/router": "^10.1.0",
    "@nebular/eva-icons": "^6.0.1",
    "@nebular/moment": "^6.0.1",
    "@nebular/security": "^6.0.1",
    "@nebular/theme": "^6.0.1",

leduclinh7141 commented 4 years ago

Same here. I had to downgrade my project's typescript version from 4.0.2 to 3.9.7 as a workaround.

argupta23 commented 4 years ago

@leduclinh7141 thanks for sharing the info. That indeed fixes the issue.

argupta23 commented 4 years ago

@yggg

Any plans to add support for Typescript 4.0.2?

Thanks

Suroor-Ahmmad commented 4 years ago

one more issue with NbTreeGrid #2449

softgandhi commented 4 years ago

I am also getting the same issue while upgrading to angular 10. Downgrading tslint to 5.15.0 and typescript 3.9.7 worked!! Hope to get the fix for the same for the latest version of typescript and tslint soon. Thanks.

sgClaudia98 commented 4 years ago

Same Here, waiting support for TypeScript 4. Also Downgrade typescript to 3.9.7, fix the issue

yggg commented 4 years ago

Version 6.2.0 with TypeScript 4 support is available on npm. Please note, you also need to update @angular/cdk to versions 10.2.1+.

haziqAhmed7 commented 4 years ago

@yggg I am getting this error

ERROR in node_modules/@nebular/theme/components/cdk/table/cell.d.ts:35:5 - error TS2610: 'name' is defined as an accessor in class 'CdkColumnDef', but is overridden here in 'NbColumnDefDirective' as an instance property.

35 name: string;

node_modules/@nebular/theme/components/cdk/table/cell.d.ts:39:5 - error TS2610: 'stickyEnd' is defined as an accessor in class 'CdkColumnDef', but is overridden here in 'NbColumnDefDirective' as an instance property.

39     stickyEnd: boolean;

node Version 10.16.3

npm version 6.9.0

Angular

"@angular/cdk": "10.2.5", "@angular/common": "11.0.0-next.6", "@angular/compiler": "11.0.0-next.6", "@angular/core": "11.0.0-next.6", "@angular/forms": "11.0.0-next.6", "@angular/material": "10.2.5", "@nebular/theme": "^4.6.0",

wauchi commented 3 years ago

Are there any updates on this issue? I'm having the exact same error as @haziqAhmed7

sajal-n commented 3 years ago

I am having similar issue when upgraded to @angular 11. Is there a resolution to this issue ? I guess typescript cannot be downgraded below 4 with Angular11

eddyizm commented 3 years ago

yeah, downgrading seems like a bad idea since getting to Angular 10 is already falling behind a bit. Same issue. Following the link to @yggg ticket, Changing those two versions in the package.json file and updating did the trick.

found these two in package.json

 "dependencies": {
      "@angular/cdk": "^9.0.0",
      "@nebular/theme": "^5.1.0",

and changed to:

 "dependencies": {
       "@angular/cdk": "^10.2.1",
       "@nebular/theme": "^6.2.0",

Then ran npm install and my project is back up successfully!

akveo / nebular