“Sass错误”；函数X在没有@return的情况下完成；

我在尝试将相当复杂的渐变转换为SASS的混音时遇到了一些问题，大多数渐变都很好，我相信我的颜色停止也正确，我相信我的混音不允许我这样做（左上，右下）

我需要这个：

.progress.stripes.animate > .bar > span {
  background-image: -webkit-gradient(
  linear, left top, right bottom, 
  color-stop(.25, rgba(255, 255, 255, .2)), 
  color-stop(.25, transparent), 
  color-stop(.5, transparent), 
  color-stop(.5, rgba(255, 255, 255, .2)), 
  color-stop(.75, rgba(255, 255, 255, .2)), 
  color-stop(.75, transparent), to(transparent));
  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, .2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, .2) 50%, rgba(255, 255, 255, .2) 75%, transparent 75%, transparent);
}

要使用此混音，请执行以下操作：

@mixin linear-gradient($gradientLine, $colorStops...) {
  background-color: nth($colorStops,1);
  background-image: -webkit-gradient(linear, $gradientLine, $colorStops);
  background-image: -webkit-linear-gradient($gradientLine, $colorStops);
  background-image:    -moz-linear-gradient($gradientLine, $colorStops);
  background-image:      -o-linear-gradient($gradientLine, $colorStops);
  background:             -ms-linear-gradient($gradientLine, $colorStops);
  @if length($colorStops) == 2 {
    $colour1:nth($colorStops,1);
    $colour2:nth($colorStops,2);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{$colour1}', endColorstr='#{$colour2}',GradientType=0 );
  }  
  @if length($gradientLine) == 2 {
  background-image:         linear-gradient(to #{inverse-side(nth($gradientLine, 1))} #{inverse-side(nth($gradientLine, 2))}, $colorStops);
  } @else {
  background-image:         linear-gradient(to #{inverse-side($gradientLine)}, $colorStops);
  }
}

$grad: rgba(255, 255, 255, .2);
.progress.stripes.animate > .bar > span {
  @include linear-gradient((left top, right bottom),$grad 25%, $transparent 25%, $transparent 5%, $grad 5%, $grad 75%, $transparent 75%);
}

这是我尝试过的，但不起作用…

@mixin linear-gradient($gradientLine, $colorStops...) {
  background-color: nth($colorStops,1);
  background-image: -webkit-gradient(linear, $gradientLine, $colorStops);
  background-image: -webkit-linear-gradient($gradientLine, $colorStops);
  background-image:    -moz-linear-gradient($gradientLine, $colorStops);
  background-image:      -o-linear-gradient($gradientLine, $colorStops);
  background:             -ms-linear-gradient($gradientLine, $colorStops);
  @if length($colorStops) == 2 {
    $colour1:nth($colorStops,1);
    $colour2:nth($colorStops,2);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#{$colour1}', endColorstr='#{$colour2}',GradientType=0 );
  }  
  @if length($gradientLine) == 2 {
  background-image:         linear-gradient(to #{inverse-side(nth($gradientLine, 1))} #{inverse-side(nth($gradientLine, 2))}, $colorStops);
  } @else {
  background-image:         linear-gradient(to #{inverse-side($gradientLine)}, $colorStops);
  }
}

$grad: rgba(255, 255, 255, .2);
.progress.stripes.animate > .bar > span {
  @include linear-gradient((left top, right bottom),$grad 25%, $transparent 25%, $transparent 5%, $grad 5%, $grad 75%, $transparent 75%);
}

---

Sass在错误消息中告诉您这不起作用的原因：函数反向结束，没有@return

您在这里只考虑了4个条件：顶部、右侧、底部、左侧。还有第五个选项被忽略了：以上都没有。如果应该只有4个选项，那么您需要3个If/else块，并且在最末端有一个返回值，这就是您的全部

@function inverse-side($side) {
    @if $side == top {
        @return bottom;
    } 
    @else if $side == bottom {
        @return top;
    }
    @else if $side == left {
        @return right;
    }
    @return left;
}

---

什么不起作用？你有错误吗？你得到了不正确的输出？嗨，我得到了这个错误：

error-scss/./shared/_-mixins.scss（第161行：函数反向端完成，没有@return）

反向端函数的代码是什么？对不起，我没有意识到正在使用：

@Function-inverse-side（$side）{@if$side==top{@return bottom；}@else if$side==bottom{@return top；}@else if$side==left{@return right；}@else if$side==right{@return left；}}}

为什么要重新发明轮子？Compass已经有了一种更强大的渐变方式：Compass在这方面也帮不了我，bourbon library也帮不了我，我遇到的问题是，显然我需要能够返回

左上、右下

作为第一个语句，但“，”认为我们可以进入下一个项目。是的，我的反函数仍然是错误的，但是罗盘和波旁威士忌也不支持这个。这和罗盘或波旁威士忌有什么关系

$gradientLine

是列表列表，您将列表发送到

反向侧

（例如

反向侧（左上）

和

反向侧（右下）

，而不是单个值。