Sass 错误：“typography-config”角度 4.x 后 CSS 无效答案

【问题标题】：Sass error : Invalid CSS after "typography-config" angular 4.xSass 错误：“typography-config”角度 4.x 后 CSS 无效
【发布时间】：2018-04-28 12:01:18
【问题描述】：

我想为资产文件夹中的 angular 4.x 项目集成我的自定义字体。我正在使用有角的材料。所以对于材料，我在我的 styles.sass 中设置自定义排版

代码如下：

@import '~@angular/material/theming'

$used-fonts : 'Avenir', arial

$general-typography : mat-typography-config(
  $font-family: quote($used-fonts)
)

@include mat-core($general-typography)

我得到的错误：

Invalid CSS after "...ography-config(": expected expression (e.g. 1px, bold), was "{"

: 给我一个错误

有什么想法吗？

【问题讨论】：

您是否尝试编译一个仅包含您显示的样式的最小 SCSS 文件？我问的原因是因为编译器实际上可能在抱怨样式表中较早发生的错误。
是的，sassmeister online 也出现了同样的错误。
不是因为你漏掉了分号吧？例如尝试在每个声明的末尾添加分号：@import '~@angular/material/theming';

标签： css angular sass angular-material2

【解决方案1】：

我建议你应该在一行内尝试。它会将其视为嵌套值

$general-typography : mat-typography-config($font-family: quote($used-fonts))

【讨论】：

【解决方案2】：

我建议尝试在每个声明后添加分号。除了规则中的最后一个声明（可选）外，CSS 要求在每个声明后使用分号，我认为 SASS 也是如此。

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

$used-fonts : 'Avenir', arial;

$general-typography : mat-typography-config(
  $font-family: quote($used-fonts)
);

@include mat-core($general-typography);

【讨论】：