是否可以创建本地/私人sass mixin？

Question

我有三个sass文件:a.scss,b.scss,c.scss

a.scss:

@mixin font($size, $color){
  font-size: #{$size};
  color: #{$color}
  }

 p{
  @include font(10px, blue)
  }

b.scss:

@mixin font()
{
..
}

c.scss

@import a.scss
@import b.scss

我认为b.scss中的mixin font()会覆盖a.scss中的mixin字体($ size,$ color).

p{
  @include font(10px, blue)  // use mixin font() in b.scss, error
  }

是否可以创建本地/私人sass mixin？或者sass中的所有mixin都是全局的,我必须为每个mixin赋予它们唯一的名称？

Answer 1

就像Sass变量一样，选择器中的混合对象对于该选择器来说是本地的。这两个mixin彼此独立：

.foo{
    @mixin my_color(){
        color: #ffcc00;
    }
    @include my_color;
}

.bar{
    @mixin my_color(){
        color: #00ffcc;
    }
    @include my_color;
}

因此，要回答您的最后一个问题-只有在全局级别定义的mixin是全局的，否则您可以安全地重用名称。在您的示例中，如果a.scss，b.scss和c.scss的结构定义了不同的总体类（例如.header，.main，.footer），则可以为每个类使用本地字体混合。

相关：定位/定义Sass mixin。

Answer 2

更新：现在使用新@use规则，您只需通过名称以-或_开头即可添加私有成员

更多信息在这里： https ://sass-lang.com/documentation/at-rules/use#private-members

Answer 3

你是对的。就像在典型的 CSS 文件中一样，您的 sass 项目是自上而下编译的。因此，与前一个混入同名的混入将覆盖它。如果您希望在 c.scss 中使用原始 mixin，则必须重新定义它。