在css变量中使用scss变量

这是我正在尝试的代码

@import "~variables";

:root
{
  --color-primary: map-get($colors, blue);
}

button {
  background: var(--color-primary);
}

在变量中，我有

$colors: (
        black : #000000,
        white : #FFFFFF,
        blue: : #888888
}

---

不幸的是它不工作，我的按钮不是蓝色的。由于scss是预编译的，我认为这会很好地工作。

您需要像这样转义scss函数：

$colors: (
        'black' : #000000,
        'white' : #FFFFFF,
        'blue' : #888888
);

:root {
  --blue: #{map-get($colors, 'blue')}
}

body {
  color: var(--blue);
}

更新：

---

基本上这是必需的。

编译后的代码是什么样子的？您需要

--color primary:#{map get（$colors，blue）}