尝试在我的自定义主题中导入角度材质主题文件，但未找到该文件

Question

我尝试在我的自定义主题中导入角度材质主题文件，当我尝试生成 css 代码时出现错误：

$ sass src/_custom-theme.scss
Error: Can't find stylesheet to import.
  ?
2 ? @import '~@angular/material/_theming.scss';
  ?         ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ?

这是我的文件的第一行。我也尝试了以下行，但出现相同的错误：

@import '~@angular/material/theming';

如果我尝试像这样导入文件，它会起作用：

@import '../node_modules/@angular/material/theming';

但奇怪的是，通过导入这样的预构建主题，只是为了测试，它可以工作

@import '~@angular/material/prebuilt-themes/deeppurple-amber.css'

WebStorm 设法生成 css 并在启动 web 应用程序时使用它，ng serve但仍显示错误消息。用webstorm和sass显示错误信息

版本：

• 角度：7.2.12
• 材料：7.3.7
• Sass：1.17.4 用 dart2js 2.2.0 编译

你有解决这个问题的想法吗？非常感谢。

Answer 1

如果您使用 Angular 9 并添加了 @angular/material 包，ng add @angular/material则可能会出现此问题。这是因为该ng add命令使用适用于旧版本 Angular 的包，并且截至目前尚未与 v9 兼容。这可以通过命令安装来解决npm install @angular/material。您可能需要先卸载该软件包。如果仍然不起作用，请删除 node_modules 文件夹和 package-lock.json 并运行npm install。

由于这是一篇旧文章，我假设这发生在 Angular v8 版本附近，这可能会导致相同的行为，直到 ngrx 通过命令更新为支持 v8 npm add。同样的解决方案也应该可以解决 Angular 版本更新的未来版本的问题。