PostCSS plugin implementing BEM as at-rules.
Switch branches/tags
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
test Add bem as option Jun 11, 2015
.eslintrc Initial commit Jun 2, 2015
.gitignore Initial commit Jun 2, 2015
.npmignore Initial commit Jun 2, 2015
.travis.yml Initial commit Jun 2, 2015
CHANGELOG.md
LICENSE Initial commit Jun 2, 2015
README.md Add bem as option Jun 11, 2015
gulpfile.js Initial commit Jun 2, 2015
index.js Add bem as option Jun 11, 2015
package.json Release v0.3.0 Jun 11, 2015

README.md

PostCSS Bem Build Status

PostCSS plugin implementing BEM as at-rules.

@utility utilityName {
    color: green;
}

@utility utilityName small {
    color: blue;
}

@component ComponentName {
    color: cyan;

    @modifier modifierName {
        color: yellow;
    }

    @descendent descendentName {
        color: navy;
    }

    @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.