如果属性以双破折号开头，Sass将不会编译变量

Question

我已经将红宝石宝石更新到最新版本。现在，在编译.scss文件时，如果变量之前的属性名称（属性的值）以双破折号开头，则编译器不会用其值替换变量--：

示例（source.scss）：

$header-height: 58px;
$accent: red;

paper-tabs {
    height: $header-height;
    --paper-tabs-selection-bar-color: $accent;
}

预期输出（output.css）：

paper-tabs {
    height: 58px;
    --paper-tabs-selection-bar-color: red;
}

不需要的输出（output.css）：

paper-tabs {
    height: 58px;
    --paper-tabs-selection-bar-color: $accent;
}

难道我做错了什么？我可以以某种方式纠正它吗？谢谢。

Answer 1

经过一段时间的努力，我找到了解决方案。只需将变量视为位于字符串内即可。

所以代替：

$header-height: 58px;
$accent: red;

paper-tabs {
    height: $header-height;
    --paper-tabs-selection-bar-color: $accent;
}

我们应该写：

$header-height: 58px;
$accent: red;

paper-tabs {
    height: $header-height;
    --paper-tabs-selection-bar-color: #{$accent};
}

并且该变量已按预期正确地在output.css中替换。谢谢你们。