0.0.3 • Published 4 years ago

@zhengxs/sass.bem v0.0.3

Weekly downloads
-
License
MIT
Repository
github
Last release
4 years ago

sass-bem

NPM

fork sass-bem,不支持 node-sass

安装

# With NPM
$ npm install @zhengxs/sass.bem --save

# With Yarn
$ yarn add @zhengxs/sass.bem

# With PNPM
$ pnpm add @zhengxs/sass.bem

示例

@use '~@zhengxs/sass.bem/mod' as *;

// coding...
@include component('media', 'z') {
  // or c('media')
  margin: 10px;

  @include element('image') {
    // or e('image')
    float: left;
    margin-right: 10px;

    // 期望添加 rtl 类控制 image 的行为
    // 输出.z-media--rtl .z-media__image
    @include at('rtl') {
      float: right;
      margin-left: 10px;
      margin-right: 0;
    }
  }

  @include element('thumb') {
    // or e('thumb')
    display: block;
  }
}

输出

.z-media {
  margin: 10px;
}

.z-media__image {
  float: left;
  margin-right: 10px;
}

.z-media--rtl .z-media__image {
  float: right;
  margin-left: 10px;
  margin-right: 0;
}

.z-media__thumb {
  display: block;
}

Try in runkit

注意

  • 无法使用新语法导出 _ 的内容,所以 hack 的别名被移除
  • parse 这个 mixin 不要使用,目前无法动态调用 mixin

License

MIT license.

0.0.3

4 years ago

0.0.2

4 years ago

0.0.1

4 years ago