SASS/SCSS 变量到 CSS 可能吗？

Question

当试图在 CSS 中显示我声明的 SASS 变量时，我没有在 CSS 输出文件中获得变量本身，而是赋予变量。

为了更清楚，这是我得到的：

SCSS/SASS 输入

$gray__background: #2d2d2d;

:root {
    --gray__background: #{$gray__background};
}

body{
  background-color: $gray__background;
}

CSS“输出”

:root {
 --gray__background: #2d2d2d;
}

body{
 background-color: #2d2d2d;
}

这就是我期望得到的：

CSS“输出”

:root {
  --gray__background: #2d2d2d;
}
body{
  background-color: var(--gray__background);
}

短篇小说：我想知道 CSS“自动生成”文件 background-color: var(--gray__background); 中的结果是否可以实现，而不是 background-color: #2d2d2d;。

我使用 VSCode 的 Live Sass Compiler 扩展名。

抱歉，如果我的问题有点含糊。我是编码新手。

Answer 1

:root 变量在 SCSS 中声明，但未被使用，因此它们不会出现在 CSS 输出中。 看起来你必须在 SCSS 中使用 --gray__background 而不是 $gray__background 所以它变成： background-color: var(--gray__background); .

希望对您有所帮助。