css - SASS 字符串到“非字符串”

Question

我有一个场景，我使用 JSON 文件来动态创建 SASS 变量。该插件（Gulp-json-css）可以保留地图和数组属性，但不会在地图键上添加引号：

$palettes : ( white: #ffffff, grey: (lite: #aaaaaa, base: #999999, dark: #666666), black: #000000);

我遇到了一个问题，map-get()如果将带引号的字符串用于参数，则无法找到适当的值。

map-get($palettes, white) => #ffffff

map-get($palettes, "white") => null
--
Conclusion : (white != "white")

无论如何将带引号的字符串更改为“未引用”字符串？我知道你在想什么，但unquote()也不起作用：

$color : "white";
white == unquote($color) => false

我需要一种方法来"white"转换white，以便使用该map-get()函数适当地检索正确的值。

更新/解决方案

对于遇到此页面并正在寻找解决方案的人，我最终编写了一个函数，该函数将遍历地图并为其键添加引号：

@function quoteMapKeys( $map )
{
    $newMap : ();

    @each $key,$value in $map
    {
        @if type-of($value) == 'map'
        {
            $value : quoteMapKeys( $value );
        }

        $newMap : map-merge($newMap, (quote($key):$value));
    }

    @return $newMap;
}

$palettes : quoteMapKeys( $palettes );

标签： csssassgulp-sassnode-sass