angular使用material,cdk遇到的问题

背景

angular项目中添加使用 material,cdk两个包的时候,编译不通过,报了一大堆错误。

主要是这个:An accessor cannot be declared in an ambient context.

完成错误代码

ERROR in 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/drag-drop/directives/drag-handle.d.ts:25:9 - error TS1086: An accessor cannot be declared in an ambient context.

25     get disabled(): boolean;
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drag-handle.d.ts:26:9 - error TS1086: An accessor cannot be declared in an ambient context.

26     set disabled(value: boolean);
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drag-preview.d.ts:25:9 - error TS1086: An accessor cannot be declared in an ambient context.

25     get matchSize(): boolean;
           ~~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drag-preview.d.ts:26:9 - error TS1086: An accessor cannot be declared in an ambient context.

26     set matchSize(value: boolean);
           ~~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drag.d.ts:72:9 - error TS1086: An accessor cannot be declared in an ambient context.

72     get disabled(): boolean;
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drag.d.ts:73:9 - error TS1086: An accessor cannot be declared in an ambient context.

73     set disabled(value: boolean);
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drop-list-group.d.ts:26:9 - error TS1086: An accessor cannot be 
declared in an ambient context.

26     get disabled(): boolean;
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drop-list-group.d.ts:27:9 - error TS1086: An accessor cannot be 
declared in an ambient context.

27     set disabled(value: boolean);
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drop-list.d.ts:69:9 - error TS1086: An accessor cannot be declared in an ambient context.

69     get disabled(): boolean;
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/directives/drop-list.d.ts:70:9 - error TS1086: An accessor cannot be declared in an ambient context.

70     set disabled(value: boolean);
           ~~~~~~~~
node_modules/@angular/cdk/drag-drop/drag-ref.d.ts:172:9 - error TS1086: An accessor cannot be declared in an ambient context.

172     get disabled(): boolean;
            ~~~~~~~~
node_modules/@angular/cdk/drag-drop/drag-ref.d.ts:173:9 - error TS1086: An accessor cannot be declared in an ambient context.

173     set disabled(value: boolean);
            ~~~~~~~~
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:53:9 - error TS1086: An accessor cannot be declared in 
an ambient context.

53     get cdkVirtualForOf(): DataSource<T> | Observable<T[]> | NgIterable<T> | null | undefined;
           ~~~~~~~~~~~~~~~
node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:54:9 - error TS1086: An accessor cannot be declared in 
an ambient context.

54     set cdkVirtualForOf(value: DataSource<T> | Observable<T[]> | NgIterable<T> | null | 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     get cdkVirtualForTrackBy(): TrackByFunction<T> | undefined;
           ~~~~~~~~~~~~~~~~~~~~
node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:61:9 - error TS1086: An accessor cannot be declared in 
an ambient context.

61     set cdkVirtualForTrackBy(fn: TrackByFunction<T> | undefined);
           ~~~~~~~~~~~~~~~~~~~~
node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:64:9 - error TS1086: An accessor cannot be declared in 
an ambient context.

64     set cdkVirtualForTemplate(value: TemplateRef<CdkVirtualForOfContext<T>>);
           ~~~~~~~~~~~~~~~~~~~~~
node_modules/@angular/cdk/scrolling/virtual-for-of.d.ts:69:9 - error TS1086: An accessor cannot be declared in 
an ambient context.

解决

原因: angular版本号 与 material cdk 版本号不匹配。

从官网可以看出有很多个版本。默认安装material,cdk的时候如果未指明版本号,会安装最新的。但是我自己的angular版本没用最新的还是8.3.8.所以才导致上面的报错。
在这里插入图片描述

最后只需要修改package.json中 material,cdk版本号,重新npm install 一下就能解决了。
(我的angular8.* 所以用的 material,cdk版本 8.2.3)
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qwe1314225/article/details/109055740