从地图在Sass中生成CSS颜色变量

Question

我已经99％地找到了解决方案。我将颜色变量存储在地图中：

$colors       : (
    dark-green : #4f5b50,
    gold : #b39574,
    light-green : #e0e7e0,
    white : #fff
);

在我的根样式表中，生成CSS变量：

:root {
    @each $key, $val in $colors {
        #{--$key} : $val;
    }
}

当Sass编译它时，我得到：

:root {
    --dark-green: #4f5b50;
    --gold: #b39574;
    --light-green: #e0e7e0;
    --#fff: #fff;
}

白色是怎么回事？为什么我不能正确输出密钥？

编辑：因此，答案是在定义引号时将引号放在地图关键字周围。显然，如果您不这样做，Sass会将颜色哈希替换为“白色”，并且我假设CSS中还有其他命名的颜色。