Angular Error: Cannot resolve type entity i5.DragDropModule to symbol

问题：在angular 17 中使用primeNg PickList Components 时报错，错误信息如下：

✘ [ERROR] Angular compilation initialization failed. [plugin angular-compiler]

  Error: Cannot resolve type entity i5.DragDropModule to symbol
      at reflectTypeEntityToDeclaration (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-NMMGOE7N.js:727:11)
      at extraReferenceFromTypeQuery (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:1472:26)
      at file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:1467:12
      at Array.map (<anonymous>)
      at extractReferencesFromType (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:1463:23)
      at DtsMetadataReader.getNgModuleMetadata (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:1669:16)
      at CompoundMetadataReader.getNgModuleMetadata (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:1618:27)
      at StandaloneComponentScopeReader.getScopeForComponent (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-LV7FGTGX.js:2673:48)
      at CompoundComponentScopeReader.getScopeForComponent (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:3851:27)
      at ComponentDecoratorHandler.resolve (file:///home/bluejay/IdeaProjects/internal-affairs-management/frontend/angular-frontend-internal-affairs/node_modules/@angular/compiler-cli/bundles/chunk-26Z5EPVF.js:7413:36)

Watch mode enabled. Watching for file changes...

我们分析问题在哪儿？

按住ctrl点击PickListModule,打开picklist.d.ts 可以找到 typeof i5.DragDropModule 按住ctrl点击DragDropModule发现没有可以进入的链接，点击i5 链接到cdk后没有进一步链接，可判断，缺少 @angular/cdk 包

修复： npm install @angular/cdk

再报错：

npm error code ERESOLVE
npm error ERESOLVE unable to resolve dependency tree
npm error
npm error While resolving: angular-frontend-internal-affairs@0.0.0
npm error Found: @angular/common@17.3.12
npm error node_modules/@angular/common
npm error   @angular/common@"^17.3.0" from the root project
npm error
npm error Could not resolve dependency:
npm error peer @angular/common@"^19.0.0 || ^20.0.0" from @angular/cdk@19.0.5
npm error node_modules/@angular/cdk
npm error   @angular/cdk@"*" from the root project
npm error
npm error Fix the upstream dependency conflict, or retry
npm error this command with --force or --legacy-peer-deps
npm error to accept an incorrect (and potentially broken) dependency resolution.
npm error
npm error
npm error For a full report see:
npm error /home/bluejay/.npm/_logs/2025-01-09T12_01_56_604Z-eresolve-report.txt
npm error A complete log of this run can be found in: /home/bluejay/.npm/_logs/2025-01-09T12_01_56_604Z-debug-0.log

从出错信息可知系版本冲突。安装正确的版本：

 npm install @angular/cdk@17

问题解决。

第二天再翻官网文档，补充如下：

primeNg官网https://v17.primeng.org/picklist

PickList is used as a controlled input with source and target properties. Content of a list item needs to be defined with the pTemplate property that receives an object in the list as parameter. Drag & drop functionality depends on @angular/cdk package.

你看，明确写着，拖放功能依赖@angular/cdk