在SCSS中定义了一个变量,但是在CSS中使用SCSS中定义的变量无效:

1
2
3
4
5
$color: #f00;

:root {
--text-color: $color; /** 无效 */
}

使用#{}Interpolation插值来解决此问题:

1
2
3
4
5
$color: #f00;

:root {
--text-color: #{$color};
}

参考文档:https://sass-lang.com/documentation/interpolation