Question

我正在使用scsslint验证我的scss，我收到此错误，解决这个问题的最佳方法是什么？

[W] ColorVariable：像rgba(0, 0, 0, 0.75)这样的颜色文字应该仅用于变量声明;他们应该通过在其他地方变量。

 @mixin box-shadow-new($value) {
      -webkit-box-shadow: $value;
      -moz-box-shadow: $value;
      box-shadow: $value;
    }



 .btn-exit {
      @include box-shadow-new(4px 3px 26px -6px rgba(0, 0, 0, .75));
      background-color: $button-bg-main;
      border-color: $button-bg-main;
      color: $button-color-main;
    }

Answer 1

这告诉你应该将颜色设置为变量而不是直接在样式中编写。因此，在您的variables.scss文件中，或者您对变量进行分组的任何地方（您是，对吗？here's one way），请执行以下操作：

$box-shadow-color: rgba(0, 0, 0, .75)

我会更进一步，建议完整的盒子阴影样式是一个变量，这样你就可以轻松地将这种样式放在任何地方并保持一致：

$box-shadow: 4px 3px 26px -6px rgba(0, 0, 0, .75);

请注意，可能会警告您将颜色本身置于变量中。它有时候会变成非常“嵌套的玩偶”，但理论上你可以轻易地重复使用那种半透明的黑色。

然后将mixin称为：

@include box-shadow-new($box-shadow);

scsslint box-shadow sass mixin颜色文字，如rgba验证

1 个答案: