Angular9安装Angular Material后编译失败依赖缺失如何解决

云上老周

2026-8-26

Angular9 安装@angular/material后编译报缺失CDK依赖解决方案

报错信息

Angular9项目安装angular-material后编译失败，抛出如下错误：

ERROR in The target entry-point "@angular/material/sidenav" has missing dependencies:
@angular/cdk/platform
@angular/cdk/scrolling
@angular/cdk/a11y
@angular/cdk/bidi
@angular/cdk/coercion
@angular/cdk/keycodes
仅降级angular material版本无法解决该问题，按以下步骤操作即可修复：

修复步骤

对齐关联依赖版本
@angular/material 强依赖同版本号的 @angular/cdk，且两者版本必须和项目内Angular核心包（@angular/core、@angular/common等）的大版本完全一致。Angular9仅兼容9.x版本的material和cdk，安装更高版本、只装material不装cdk、material和cdk版本号不一致，都会触发该类依赖缺失报错。
多数人降级material后仍报错，核心原因是只调整了material版本，没有同步调整cdk版本。
先执行命令卸载现有不匹配的依赖：
npm uninstall @angular/material @angular/cdk
再安装对应9.x稳定版的包：
npm install @angular/material@9.2.4 @angular/cdk@9.2.4 --save
清理依赖缓存和旧构建产物
版本调整完成后，清理残留缓存避免旧版本文件干扰：
```
# Mac/Linux环境执行
rm -rf node_modules package-lock.json
npm cache clean --force
npm install
```
Windows环境可手动删除node_modules文件夹、package-lock.json文件后，依次执行npm cache clean --force和npm install即可。
检查tsconfig配置
如果上述操作后仍报错，打开项目根目录的tsconfig.json，查看compilerOptions.paths配置项，删除所有手动添加的@angular/cdk、@angular/material相关路径映射规则，这类自定义映射会打断Angular编译器的依赖查找逻辑。
重新编译验证
执行ng serve启动开发服务，或执行ng build执行构建，依赖缺失报错会直接消失。