Angular项目构建报错：无法找到@import '@angular/material/theming'样式表

DevOps 小满

2026-7-2

解决Angular构建时sass-loader找不到@angular/material/theming的问题

检查Angular Material依赖是否安装完整
确认已安装Angular Material及配套依赖，执行以下命令：
```
npm install @angular/material @angular/cdk
```
若使用Angular 14及以上版本，还需安装动画依赖：
```
npm install @angular/animations
```

配置样式预处理器的搜索路径
打开angular.json，找到对应项目的build配置，添加或完善stylePreprocessorOptions，确保node_modules被纳入sass的搜索路径：

"projects": {
  "你的项目名称": {
    "architect": {
      "build": {
        "options": {
          "stylePreprocessorOptions": {
            "includePaths": [
              "node_modules"
            ]
          }
        }
      }
    }
  }
}

验证导入语句的准确性
确认报错行的导入语句拼写无误，正确格式为：
```
@import '@angular/material/theming';
```
注意不要遗漏分号，也不要写错包名。
清理缓存并重新构建项目
缓存可能导致依赖解析异常，执行以下步骤重置依赖并重新构建：
```
npm cache clean --force
rm -rf node_modules package-lock.json
npm install
ng build
```
确保Angular与Material版本兼容
Angular Material版本必须与Angular核心版本匹配，查看package.json中的版本号，若不匹配则更新到对应版本：
```
npm install @angular/material@<你的Angular核心版本号>
```