Angular Material - 无法解析 '@angular/material/theming'

Question

我已经关注了 official guide并创建了一个包含以下内容的 app-theme.scss:

@import '~@angular/material/theming';    
@include mat-core();    
$candy-app-primary: mat-palette($mat-indigo);
$candy-app-accent:  mat-palette($mat-pink, A200, A100, A400);    
$candy-app-warn:    mat-palette($mat-red);    
$candy-app-theme: mat-light-theme($candy-app-primary, $candy-app-accent, $candy-app-warn);    
@include angular-material-theme($candy-app-theme);

styles.css 的内容:

@import './app-theme.scss';

但是，我在编译过程中总是遇到以下错误:找不到模块:错误:无法解析“@angular/material/theming”。我必须做什么才能让它发挥作用？

Answer 1

已解决:

Angular Material 2 文档假定您默认使用 sass 样式表。这从来没有被清楚地传达或解释过。下面列出的步骤可用于解决此问题。

1. 将 styles.css 重命名为 styles.scss 并将其内容设置为 @import './app-theme';
2. 在 angular-cli.json 中，将 styles: ["styles.css"] 更改为 styles: ["styles.scss"]
3. 重启 npm