我可以在application.css中使用foundation的scss中定义的变量吗？

Question

在我的rails应用程序的资产application.css中，我有以下行

/*
 *= require foundation_and_overrides
 *= require_self
 *= require_tree .
 */

ul#mainmenu li {
    background-color: $mainColor;
}

包含文件foundation_and_overrides.scss，其中我定义了以下变量

$mainColor: #eba10e;

但是，当我现在尝试在我的application.css文件中直接使用此变量时，它不会转换为#eba10e，所以我在生成的css文件中得到这样的行：

background-color: $mainColor;

所以我的问题，如何在application.css文件中使用该变量？

Answer 1

不，纯CSS不支持变量。

但是，如果将其重命名为application.scss，它将起作用。之后，它将与Sass一起编译。 CSS总是有效的SCSS，所以这将没有问题。

此外，您必须使用@import语句而不是require，因此其他文件将以“SASS方式”导入。