angulartypescriptcompiler-errorsangular11typescript4.0

'disabled' is defined as a property in class 'CanColor & CanDisableRipple & HasTabIndex & MatChipBase', but is overridden here in 'MatChip' as an acce


I updated my Angular version from 9.1 to 11 and now its giving compilation error.

Error: node_modules/@angular/material/chips/chips.d.ts:120:9 - error TS2611:'disabled' is defined as a property in class 'CanColor & CanDisableRipple & HasTabIndex & MatChipBase', but is overridden here in 'MatChip' as an accessor.
get disabled(): boolean

I guess it related to typescript version. Since I am on Angular 11, I cannot downgrade typescript below 4. Is there any option to solve this?

Current version Typescript Version -> 4.1.5

Dependencies

Dev Dependencies


Solution

  • Upgrading Angular has to be the most painful experience. Whenever you do, the upgrade never upgrades all of your @angular packages like it should. You have to do that manually.

    Match all of you @angular packages to the same version of Angular that you're using. Look in your package.json file and you'll see what versions are there.

    This is what worked for me -

    npm i @angular/material@11.2.13
    npm i @angular/cdk@11.2.13
    

    If you want to see what the latest version is, in this case for version 11, you can go to https://www.npmjs.com/ and search for @angular/material then click on the versions tab.