postcss-at-rules-bem

PostCSS plugin for BEM name convention

Usage no npm install needed!

<script type="module">
  import postcssAtRulesBem from 'https://cdn.skypack.dev/postcss-at-rules-bem';
</script>

README

PostCSS At Rules Bem Build Status

PostCSS plugin for BEM name convention.

/* Input example */
@block foo {
    width: 1px;

    @mod bar {
        width: 2px;
    }

    @el baz {
        width: 3px;

        @mod qux {
            width: 4px;
        }
    }
}

/* Output example */
.foo {
    width: 1px;
}

.foo_bar {
    width: 2px;
}

.foo__baz {
    width: 3px;
}

.foo__baz_qux {
    width: 4px;
}

Usage

postcss([ require('postcss-at-rules-bem') ])

See PostCSS docs for examples for your environment.