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

Question

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

Answer 1

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/[email protected]
npm i @angular/[email protected]

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.