After installing a CDK of angular getting an error during compilation
ERROR in node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts:29:9 - error TS1086: An accessor cannot be declared in an ambient context.
29 get enabled(): boolean; ~~~~~~~ node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts:30:9 - error TS1086: An accessor cannot be declared in an ambient context.
30 set enabled(value: boolean); ~~~~~~~ node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts:128:9 - error TS1086: An accessor cannot be declared in an ambient context.
128 get enabled(): boolean; ~~~~~~~ node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts:129:9 - error TS1086: An accessor cannot be declared in an ambient context.
129 set enabled(value: boolean); ~~~~~~~ node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts:134:9 - error TS1086: An accessor cannot be declared in an ambient context.
134 get autoCapture(): boolean; ~~~~~~~~~~~ node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts:135:9 - error TS1086: An accessor cannot be declared in an ambient context.
135 set autoCapture(value: boolean); ~~~~~~~~~~~ node_modules/@angular/cdk/a11y/key-manager/list-key-manager.d.ts:96:9 - error TS1086: An accessor cannot be declared in an ambient context.
96 get activeItemIndex(): number | null; ~~~~~~~~~~~~~~~ node_modules/@angular/cdk/a11y/key-manager/list-key-manager.d.ts:98:9 - error TS1086: An accessor cannot be declared in an ambient context.
98 get activeItem(): T | null; ~~~~~~~~~~ node_modules/@angular/cdk/a11y/live-announcer/live-announcer.d.ts:69:9 - error TS1086: An accessor cannot be declared in an ambient context.
69 get politeness(): AriaLivePoliteness; ~~~~~~~~~~ node_modules/@angular/cdk/a11y/live-announcer/live-announcer.d.ts:70:9 - error TS1086: An accessor cannot be declared in an ambient context.
70 set politeness(value: AriaLivePoliteness); ~~~~~~~~~~ node_modules/@angular/cdk/bidi/dir.d.ts:26:9 - error TS1086: An accessor cannot be declared in an ambient context.
26 get dir(): Direction; ~~~ node_modules/@angular/cdk/bidi/dir.d.ts:27:9 - error TS1086: An accessor cannot be declared in an ambient context.
27 set dir(value: Direction); ~~~ node_modules/@angular/cdk/bidi/dir.d.ts:29:9 - error TS1086: An accessor cannot be declared in an ambient context.
29 get value(): Direction; ~~~~~ node_modules/@angular/cdk/collections/selection-model.d.ts:24:9 - error TS1086: An accessor cannot be declared in an ambient context.
24 get selected(): T[]; ~~~~~~~~ node_modules/@angular/cdk/observers/observe-content.d.ts:62:9 - error TS1086: An accessor cannot be declared in an ambient context.
62 get disabled(): any; ~~~~~~~~ node_modules/@angular/cdk/observers/observe-content.d.ts:63:9 - 39m91merror TS1086: An accessor cannot be declared in an ambient context.
63 set disabled(value: any); ~~~~~~~~ node_modules/@angular/cdk/observers/observe-content.d.ts:66:9 - error TS1086: An accessor cannot be declared in an ambient context.
66 get debounce(): number; ~~~~~~~~ node_modules/@angular/cdk/observers/observe-content.d.ts:67:9 - error TS1086: An accessor cannot be declared in an ambient context.
67 set debounce(value: number); ~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:60:9 - error TS1086: An accessor cannot be declared in an ambient context.
60 get offsetX(): number; ~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:61:9 - error TS1086: An accessor cannot be declared in an ambient context.
61 set offsetX(offsetX: number); ~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:63:9 - error TS1086: An accessor cannot be declared in an ambient context.
63 get offsetY(): number; ~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:64:9 - error TS1086: An accessor cannot be declared in an ambient context.
64 set offsetY(offsetY: number); ~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:86:9 - error TS1086: An accessor cannot be declared in an ambient context.
86 get hasBackdrop(): any; ~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:87:9 - error TS1086: An accessor cannot be declared in an ambient context.
87 set hasBackdrop(value: any); ~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:89:9 - error TS1086: An accessor cannot be declared in an ambient context.
89 get lockPosition(): any; ~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:90:9 - error TS1086: An accessor cannot be declared in an ambient context.
90 set lockPosition(value: any); ~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:92:9 - error TS1086: An accessor cannot be declared in an ambient context.
92 get flexibleDimensions(): boolean; ~~~~~~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:93:9 - error TS1086: An accessor cannot be declared in an ambient context.
93 set flexibleDimensions(value: boolean); ~~~~~~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:95:9 - error TS1086: An accessor cannot be declared in an ambient context.
95 get growAfterOpen(): boolean; ~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:96:9 - error TS1086: An accessor cannot be declared in an ambient context.
96 set growAfterOpen(value: boolean); ~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:98:9 - error TS1086: An accessor cannot be declared in an ambient context.
98 get push(): boolean; ~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:99:9 - error TS1086: An accessor cannot be declared in an ambient context.
99 set push(value: boolean); ~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:112:9 - error TS1086: An accessor cannot be declared in an ambient context.
112 get overlayRef(): OverlayRef; ~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-directives.d.ts:114:9 - error TS1086: An accessor cannot be declared in an ambient context.
114 get dir(): Direction; ~~~ node_modules/@angular/cdk/overlay/overlay-ref.d.ts:55:9 - error TS1086: An accessor cannot be declared in an ambient context.
55 get overlayElement(): HTMLElement; ~~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-ref.d.ts:57:9 - error TS1086: An accessor cannot be declared in an ambient context.
57 get backdropElement(): HTMLElement | null; ~~~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/overlay-ref.d.ts:63:9 - error TS1086: An accessor cannot be declared in an ambient context.
63 get hostElement(): HTMLElement; ~~~~~~~~~~~ node_modules/@angular/cdk/overlay/position/connected-position-strategy.d.ts:36:9 - error TS1086: An accessor cannot be declared in an ambient context.
36 get _isRtl(): boolean; ~~~~~~ node_modules/@angular/cdk/overlay/position/connected-position-strategy.d.ts:40:9 - error TS1086: An accessor cannot be declared in an ambient context.
40 get onPositionChange(): Observable; ~~~~~~~~~~~~~~~~ node_modules/@angular/cdk/overlay/position/connected-position-strategy.d.ts:43:9 - error TS1086: An accessor cannot be declared in an ambient context.
43 get positions(): ConnectionPositionPair[]; ~~~~~~~~~ node_modules/@angular/cdk/overlay/position/flexible-connected-position-strategy.d.ts:91:9 - error TS1086: An accessor cannot be declared in an ambient context.
91 get positions(): ConnectionPositionPair[]; ~~~~~~~~~ node_modules/@angular/cdk/portal/portal-directives.d.ts:49:9 - error TS1086: An accessor cannot be declared in an ambient context.
49 get portal(): Portal | null; ~~~~~~ node_modules/@angular/cdk/portal/portal-directives.d.ts:50:9 - error TS1086: An accessor cannot be declared in an ambient context.
50 set portal(portal: Portal | null); ~~~~~~ node_modules/@angular/cdk/portal/portal-directives.d.ts:54:9 - error TS1086: An accessor cannot be declared in an ambient context.
54 get attachedRef(): CdkPortalOutletAttachedRef; ~~~~~~~~~~~ node_modules/@angular/cdk/portal/portal.d.ts:24:9 - error TS1086: An accessor cannot be declared in an ambient context.
24 get isAttached(): boolean; ~~~~~~~~~~ node_modules/@angular/cdk/portal/portal.d.ts:63:9 - error TS1086: An accessor cannot be declared in an ambient context.
63 get origin(): ElementRef; ~~~~~~ node_modules/@angular/cdk/scrolling/fixed-size-virtual-scroll.d.ts:75:9 - error TS1086: An accessor cannot be declared in an ambient context.
75 get itemSize(): number; ~~~~~~~~ node_modules/@angular/cdk/scrolling/fixed-size-virtual-scroll.d.ts:76:9 - error TS1086: An accessor cannot be declared in an ambient context.
76 set itemSize(value: number); ~~~~~~~~ node_modules/@angular/cdk/scrolling/fixed-size-virtual-scroll.d.ts:82:9 - error TS1086: An accessor cannot be declared in an ambient context.
82 get minBufferPx(): number; ~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/fixed-size-virtual-scroll.d.ts:83:9 - error TS1086: An accessor cannot be declared in an ambient context.
83 set minBufferPx(value: number); ~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/fixed-size-virtual-scroll.d.ts:88:9 - error TS1086: An accessor cannot be declared in an ambient context.
88 get maxBufferPx(): number; ~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/fixed-size-virtual-scroll.d.ts:89:9 - error TS1086: An accessor cannot be declared in an ambient context.
89 set maxBufferPx(value: number); ~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:49:9 - error TS1086: An accessor cannot be declared in an ambient context.
49 get cdkVirtualForOf(): DataSource | Observable | NgIterable | null | undefined; ~~~~~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:50:9 - error TS1086: An accessor cannot be declared in an ambient context.
50 set cdkVirtualForOf(value: DataSource | Observable | NgIterable | null | undefined); ~~~~~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:56:9 - error TS1086: An accessor cannot be declared in an ambient context.
56 get cdkVirtualForTrackBy(): TrackByFunction | undefined; ~~~~~~~~~~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:57:9 - error TS1086: An accessor cannot be declared in an ambient context.
57 set cdkVirtualForTrackBy(fn: TrackByFunction | undefined); ~~~~~~~~~~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:60:9 - error TS1086: An accessor cannot be declared in an ambient context.
60 set cdkVirtualForTemplate(value: TemplateRef>); ~~~~~~~~~~~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-scroll-viewport.d.ts:27:9 - error TS1086: An accessor cannot be declared in an ambient context.
27 get orientation(): 'horizontal' | 'vertical'; ~~~~~~~~~~~ node_modules/@angular/cdk/scrolling/virtual-scroll-viewport.d.ts:28:9 - error TS1086: An accessor cannot be declared in an ambient context.
28 set orientation(orientation: 'horizontal' | 'vertical'); ~~~~~~~~~~~
I did npm install and npm update but it's not worked for me. Thanks in advance.
Answer
This is due to the version incompatibility between angular/cdk, angular/material and angular/core. Most specifically, Angular Core version 8.x.x is not compatible with Angular CDK version 9.x.x.
Solution:
- Delete node_modules folder
- In package.json, change the version of cdk and material. Save.
npm install.
In my case, I was having:
"@angular/cdk": "~9.0.0",
"@angular/core": "~8.2.14",
"@angular/material": "~9.0.0"
and I changed this to:
"@angular/cdk": "~8.2.3",
"@angular/core": "~8.2.14",
"@angular/material": "~8.2.3"
and deleted node_modules and did npm install. Fixed.