gulp-dart-sass 使用 @debug 和 map 作为内插值导致错误

如何解决gulp-dart-sass 使用 @debug 和 map 作为内插值导致错误

这可能是任何人都无法提供帮助的事情，但如果有人有任何想法，那就来吧。

我的 SCSS 中有这个：

&__column {
    @each $key,$value in $colors-map {
        &#{&}--bg-#{$key} {
            @debug "map-name: #{$key}";
            @debug "map-value: #{$value}";
        }
    }
}

当使用 gulp-sass 编译（使用 LibSass）时，我得到了这个输出，正如预期的那样：

/src/scss/_column.scss:46 DEBUG: map-name: black
/src/scss/_column.scss:47 DEBUG: map-value: ("primary": #000000,"link-default": #aecf44,"link-hover": #04124f)
/src/scss/_column.scss:46 DEBUG: map-name: white
/src/scss/_column.scss:47 DEBUG: map-value: ("primary": #ffffff,"link-hover": #04124f)
/src/scss/_column.scss:46 DEBUG: map-name: green
/src/scss/_column.scss:47 DEBUG: map-value: ("primary": #aecf44,"link-hover": #04124f)
/src/scss/_column.scss:46 DEBUG: map-name: navy
/src/scss/_column.scss:47 DEBUG: map-value: ("primary": #04124f,"link-hover": #04124f)

当我使用 gulp-dart-sass 编译相同的东西时，它会产生错误并崩溃：

src\scss\_column.scss:46 DEBUG: map-name: black
Error in plugin "sass"
Message:
    src\scss\_column.scss
Error: ("primary": #000000,"link-hover": #04124f) isn't a valid CSS value.
   Γò╖
47 Γöé                 @debug "map-value: #{$value}";
                                            ^^^^^^

如果我更新 SCSS 使 $value 不再插入到字符串中，它可以与 gulp-dart-sass 一起使用：

&__column {
    @each $key,$value in $colors-map {
        &#{&}--bg-#{$key} {
            @debug "map-name: #{$key}";
            @debug $value;
        }
    }
}

src\scss\_column.scss:46 DEBUG: map-name: black
src\scss\_column.scss:47 DEBUG: ("primary": #000000,"link-hover": #04124f)
src\scss\_column.scss:46 DEBUG: map-name: white
src\scss\_column.scss:47 DEBUG: ("primary": #ffffff,"link-hover": #04124f)
src\scss\_column.scss:46 DEBUG: map-name: green
src\scss\_column.scss:47 DEBUG: ("primary": #aecf44,"link-hover": #04124f)
src\scss\_column.scss:46 DEBUG: map-name: navy
src\scss\_column.scss:47 DEBUG: ("primary": #04124f,"link-hover": #04124f)

显然这不是一个大问题，只是想知道是否有人会知道这是为什么？