bemstyla

Creates block__elem_mod-name_mod-value styl files

One command

bemstyla block__elem_mod-name_mod-val

Makes dirs and styl files

tree
blocks
└── block
    ├── __elem
    │   ├── _mod-name
    │   │   └── block__elem_mod-name_mod-val.styl
    │   └── block__elem.styl
    └── block.styl

And writes initial selector

cat blocks/block/block__elem.styl
.block__elem
    {}

Install

npm install --global bemstyla

Usage

bemstyla --help

  Usage: bemstyla [options]

  Options:

    -h, --help             output usage information
    -V, --version          output the version number
    -t, --type [type]      file type [styl]
    -f, --format [format]  file content format [styl] (by default based on type)
    -d, --dir [path]       output files location

  Examples:

    bemstyla -h
    bemstyla block__elem
    bemstyla block_mod block__elem_mod foo__bar foo__qux
    bemstyla block--mod block__elem--mod
    bemstyla header.pug body.jade footer.html
    bemstyla -t css bar__baz_qux
    bemstyla -f less foo_bar
    bemstyla -d styles/blocks blockname

Pug (Jade) file support

bemstyla index.pug
bemstyla _content.pug _sidebar.pug _footer.pug

HTML file support

bemstyla index.html
bemstyla _content.html _sidebar.html _footer.html

Output file extension

Default: styl

bemstyla -t less block__elem
bemstyla --type css block__elem

File content format

Default: styl based on file type

bemstyla -f less block__elem
bemstyla --format css block__elem

Formats

• Default, styl, sass

  .block
      {}

  Usage

  .block
      border: none

• css, less, scss

  .block {
  }

  Usage

  .block {
      border: none;
  }

Output file location

bemstyla -d css/components block__elem
bemstyla --dir styles/blocks block__elem

Solutions with the same functionality

• Bemy
• TEATIME
• BEM Tools (bem create)

License

MIT © Vladimir Rodkin