在Sass文件中编写CSS在Angular 7中抛出错误

Question

我正在尝试在angular 7的组件的sass文件中编写一个简单的CSS语法，但是我遇到了如下所示的编译错误。

sass文件仅包含如图所示的简单css

.full-width {
   width: 100%;
}

在早期的角度版本中，我没有这样的问题。

Answer 1

根据SCSS文件的文件扩展名，您实际上是在使用SASS（SCSS的旧版本）。如Sass syntax文档中所述，SASS语言使用缩进语法。

来自section on SASS：

  

缩进语法支持与SCSS相同的所有功能，但是它使用缩进代替花括号和分号来描述文档的格式。

您应该做的是将该SCSS文件的文件扩展名更改为.scss，或将SCSS语法转换为SASS。

Answer 2

这是 SASS 还是 SCSS 吗？

如果这是SASS，则括号 无效。只需删除它们即可获得有效的SASS。

.full-width 
   width: 100%;

如果您想保留方括号，则要改用SCSS语言。

在此处查看指南，以了解两者之间的区别：https://sass-lang.com/guide