在CSS3变量定义中使用SCSS变量不起作用？

我正在研究如何从客户端项目中将样式应用于可重用的角度组件。请参阅=>查找“跟进”

我现在还有一个问题：

我尝试在CSS变量中使用SCSS变量，但该CSS变量似乎没有定义：

$primary-color: #666666;

// styling reusable components
:root {
  --ang-ux-primary-color: $primary-color;
}

在其他组件中（在其他组件库中，单独构建）：

---

$primary color似乎为空。。。不是#666666，也不是#5FB0FD。

要将Sass变量转换为CSS变量，您需要：

一旦您将Sass变量转换为CSS，就无法将其恢复。因此，在其他组件中，您可能应该坚持使用纯CSS。如果未定义

--ang ux原色

，则以下将使用

#5FBOFD

--ang-ux-primary-color: var(--ang-ux-primary-color, #5FB0FD);

---

已更改，谢谢：-）sass中没有此类

var

函数。在您的例子中，$primary的值就是：

var（-ang-ux primary color，#5FB0FD）

。指定的样式是否无法呈现

$primary color

？css输出是什么？不，这不是一个好答案。带或不带插值的输出是相同的。这并不能回答问题。我充实了我的答案，以解决海报问题的第二部分。至于插值，我在CodePen上试过，它是必需的。很好，但第一部分仍然是错误的。如果将变量用作属性值，则不需要插值变量。只需使用变量名：

$primary

@muecas，那么您认为我的解决方案（

--ang ux primary color:$primary color；

）必须工作吗？您好，我想我需要回顾一下我的项目，因为它似乎都能工作（在非常有限的设置中）：

--ang-ux-primary-color: #{$primary-color};

--ang-ux-primary-color: var(--ang-ux-primary-color, #5FB0FD);