variables - 为什么 Webpack SASS-loader 不在线性梯度规则中转换 SASS 变量？

Question

我在 .scss 文件中使用 SASS 变量作为颜色。在颜色中使用单个变量：规则转换成功： color: $var1; ...但是 Webpack (^4) + sass-loader (^7) 转译抱怨这条规则：

background: linear-gradient(to bottom, $var1 0%, $var2 100%);

我尝试过插值语法，但没有成功：

background: linear-gradient(to bottom, #{$var1} 0%, #{$var2} 100%);

另外，我尝试了一个mixin，也没有成功：

@mixin theGradient(){
background: linear-gradient(to bottom, $var1 0%, $var2 100%);
}
.elementSelector {
@include theGradient();
}

还有其他想法吗？谢谢

标签： variableswebpacksasslinear-gradients

Answer 1

我正在将 _colorVars.scss @import-ing 到我的主 scss 中。在我的“部分”文件中，我删除了一些 js 注释，它们是问题所在。似乎“部分”不能包含 // 注释。