common-bem

BEM class name generator which use common scheme. Elements are delimited with two (2) underscores (__), and Modifiers are delimited by two (2) hyphens (--).

Usage no npm install needed!

<script type="module">
  import commonBem from 'https://cdn.skypack.dev/common-bem';
</script>

README

common-bem

NPM version Build Status Coveralls Status Dependency Status

BEM class name generator which use common scheme. Elements are delimited with two (2) underscores (__), and Modifiers are delimited by two (2) hyphens (--).

Install

npm install --save common-bem

Usage

By common scheme I mean scheme with double underscores and hyphens proposed by Harry Roberts in his article "MindBEMding – getting your head ’round BEM syntax". You can read more about BEM on getbem.com.

import commonBem from 'common-bem';

const bem = commonBem.lock('grid');
bem();      // grid
bem('row'); // grid__row
bem('col'); // grid__col
bem({ fixed: true });       // grid grid--fixed
bem('col', { size: 'md' }); // grid__col grid__col--size-md

API

Basically, this package is b_ with predefined options for this scheme.

License

MIT © Vladimir Starkov