Can I set a Sass variable inside a breakpoint?

Question

Is it possible to set the value of a variable once, inside a single sass-breakpoint, rather than each time I use the variable?

In other words, I'd like to do this:

$tab: 600px;
$wp: 100%;

@include breakpoint($tab) {
    $wp: 95%;
}

.alpha {
    // ...
    width: $wp;
}

.beta {
    // ...
    width: $wp;
}

.gamma {
    // ...
    width: $wp;
}

... rather than this:

$tab: 600px;
$wp: 100%;
$wp-tab: 95%;

.alpha {
    // ...
    width: $wp;
    @include breakpoint($tab) {
        width: $wp-tab;
    }
}

.beta {
    // ...
    width: $wp;
    @include breakpoint($tab) {
        width: $wp-tab;
    }
}

.gamma {
    // ...
    width: $wp;
    @include breakpoint($tab) {
        width: $wp-tab;
    }
}

I don't think the first approach will work as is. Is there another way to achieve the same result? Is this approach a bad idea?

Answer 1

这是不可能的。

引用Sass 的开发者nex3的话：

虽然这会很酷，但它与 Sass 样式表的现有语义大相径庭。您概述的内容已经具有含义：它按顺序设置变量两次，然后访问它（以某些范围问题为模）。Sass 的顺序性和命令式本质意味着您所描述的那种自动复制规则变得非常复杂。我们实际上考虑了一些非常相似的处理 SassScript & 的方法，最终意识到这样做实际上是不可能的，并且保留现有的语义。

您现在可以做的最好的近似是将需要变化的样式与参数混合，并将其包含在您的媒体查询中。

来源：https : //github.com/nex3/sass/issues/1227