0.1.1 • Published 5 years ago

wlq-postcss-bem v0.1.1

Weekly downloads
1
License
ISC
Repository
-
Last release
5 years ago

github address

Jewl/wlq-postcss-bem,欢迎大家使用我的postcss-bem插件,有任何问题欢迎提issue

wlq-postcss-bem

修改自 kezzbracey/postcss-bem,使其能够支持webpack4以上版本。并增加指令的简写模式

WLQ PostCSS Bem

/* or @u */
@utility utilityName {
    color: green;
}

@utility utilityName small {
    color: blue;
}

/* or @b */
@component ComponentName {
    color: cyan;

    /* or @m */
    @modifier modifierName {
        color: yellow;
    }
  
    /* or @e */
    @descendent descendentName {
        color: navy;
    }

    /* or @w */
    @when stateName {
        color: crimson;
    }
}

@component-namespace nmsp {
    @component ComponentName {
        color: red;
    }
}
.u-utilityName {
    color: green;
}

.u-sm-utilityName {
    color: blue;
}

.ComponentName {
    color: cyan;
}

.ComponentName--modifierName {
    color: yellow;
}

.ComponentName-descendentName {
    color: navy;
}

.ComponentName.is-stateName {
    color: crimson;
}

.nmsp-ComponentName {
    color: red;
}

Usage

postcss([ require('postcss-bem')({
    defaultNamespace: undefined, // default namespace to use, none by default
    style: 'suit' // suit or bem, suit by default
}) ])

See PostCSS docs for examples for your environment.

0.1.1

5 years ago

0.1.0

5 years ago

1.0.0

5 years ago