sass - 基于环境设置的 Sass 条件

Question

在 Compassconfig.rb文件中，您可以将 设置environment为:development或:production.

是否可以在 Sass 条件中使用此设置？这是我想要做的：

@if (environment === :development) {
    @import 'debug';
}

已解决：我在起草问题时找到了答案。无论如何都会发布，因为我没有找到任何明确解释这一点的东西。

Answer 1

部分感谢Compass 存储库中的这个问题，我发现您可以在 Sass 中使用基于设置的条件，如下所示：

@if compass-env() == 'development' {
    body {
        color: red;
    }
}

确认这适用于 Sass 3.2.5 + Compass 0.12.2 + Ruby 1.9.3p194。

但是你不能这样做：

@if compass-env() == 'development' {
    @import 'debug';
}

这会引发语法错误：“导入指令不能在控制指令或 mixins 中使用。

所以解决方法是对@import文件，然后将其全部内容包装在有条件的环境中。

Answer 2

这可以通过将环境信息存储在动态生成的 SCSS 文件中来完成（当 Compass 不可用时），然后可以在需要该信息的任何地方导入该文件。这应该在 SASS 编译器启动之前完成。

这是构建脚本的样子（即build.sh）：

#!/bin/bash

echo "\$ENV: 'production';" > ./_sass/env.scss

../node_modules/.bin/node-sass ./_sass/style.scss   ../_site/css/style.css --source-map=true

这个 SCSS 文件可以这样使用：

@import 'env';

@if ($ENV == 'production') {
   ...
   // some SCSS styling to be used in production only
   ...
}