0.0.3 • Published 4 years ago
@zhengxs/sass.bem v0.0.3
sass-bem
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;
}
注意
- 无法使用新语法导出
_
的内容,所以hack
的别名被移除 parse
这个 mixin 不要使用,目前无法动态调用 mixin