如何在SCSS中编写一个mixin,以便无需@include即可访问它?

问题描述

我正在使用一个很棒的mixin,它使用BEM方法将SASS转换为CSS。

SASS:

=e($name) 
    #{&}__#{$name}
        @content
        
=m($name) 
    #{&}--#{$name}
        @content


.hot // block
    +e(item) // element
        margin: 0
    +m(green) // modifier
        color: green

输出中,根据BEM方法获得CSS:

.hot .hot__item {
  margin: 0;
}
.hot .hot--green {
  color: green;
}

我正在迁移到SCSS。因此,我需要将现有的SASS mixin重写为相同的短SCSS mixin。

@mixin el($name) {
  #{&}__#{$name} {
    @content
  }
}

@mixin mod($name) {
  #{&}--#{$name} {
    @content
  }
}

.hot {
    @include el(item) {
        margin: 0;
    }
    @include mod(green) {
        color: green;
    }
}

但是它不像以前那么简洁...

如何在SCSS中编写一个混合器,以便无需@include即可访问它?

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)