css - SASS：在编译时设置变量

Question

是否可以在编译时设置 sass 变量？我基本上想这样做：

$color: red !default;
div#head {

  background-color: $color;

}

当我编译为 css 时，我想将 $color 设置为“蓝色”（最好从命令行）。有没有人能够做到这一点？

谢谢，克里斯

Answer 1

命令行选项的替代方法是创建其他文件，将值分配给变量。

假设您上面的代码位于名为“style.scss”的文件中。要将 $color 设置为“蓝色”，请创建一个文件，例如：

$color: blue;
@import "style";

例如，将其命名为“blue.scss”。然后用下面的编译它。

sass blue.scss:style.css

当您想为变量分配另一个值时，请创建另一个名为“green.scss”的文件，例如：

$color: green;
@import "style";

然后编译它

sass green.scss:anotherstyle.css

它有点麻烦，但可以在编译时决定变量的值。

Answer 2

我在他们的常见问题解答http://sass-lang.com/docs/yardoc/file.FAQ.html中找到了这个

如果您只想在每次编译时将一些变量传递给 CSS，例如 using --watch，您可以使用Sass 函数来定义 Ruby 脚本甚至查询数据库。但是代码只会被编译一次，并且是静态服务的。

但是，如果您需要在每次请求时使用不同的选项重新编译它，

你可以使用Sass::Engine渲染代码，使用:custom 选项 传入可以从你的 Sass 函数访问的数据

不过好像不推荐。可能是出于性能原因。