Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/tadatuta/bemmet
Simple Emmet-like tool to expand shorcuts into BEMJSON
https://github.com/tadatuta/bemmet
Last synced: 30 days ago
JSON representation
Simple Emmet-like tool to expand shorcuts into BEMJSON
- Host: GitHub
- URL: https://github.com/tadatuta/bemmet
- Owner: tadatuta
- License: other
- Created: 2015-07-30T19:43:57.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-07-01T11:57:59.000Z (over 7 years ago)
- Last Synced: 2024-10-05T08:41:14.510Z (about 1 month ago)
- Language: JavaScript
- Homepage: http://tadatuta.github.io/bemmet/
- Size: 176 KB
- Stars: 47
- Watchers: 8
- Forks: 4
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE.txt
Awesome Lists containing this project
README
# bemmet
Simple Emmet-like tool to expand abbreviations into [BEMJSON](https://en.bem.info/technology/bemjson/).
Check out [online demo](http://tadatuta.github.io/bemmet/).
Also available as [Sublime Text](https://github.com/tadatuta/sublime-bemmet), [VS Code](https://marketplace.visualstudio.com/items?itemName=volkov97.vscode-bemmet), [Atom](https://atom.io/packages/atom-bemmet) and [IntelliJ *](https://github.com/amel-true/bemmet-idea) plugins.
## Usage
```js
var bemmet = require('bemmet');
var bemjson = bemmet('b1>__e1*2>b3_theme_islands+_state_active{hello}'); // object
var bemjsonString = bemmet.stringify('b1>__e1*2>b3_theme_islands+_state_active{hello}');
console.log(bemjsonString);
// {
// block: 'b1',
// content: [
// {
// elem: 'e1',
// content: [
// {
// block: 'b3',
// mods: { theme: 'islands' },
// content: {}
// },
// {
// block: 'b1',
// mods: { state: 'active' },
// content: 'hello'
// }
// ]
// },
// {
// elem: 'e1',
// content: [
// {
// block: 'b3',
// mods: { theme: 'islands' },
// content: {}
// },
// {
// block: 'b1',
// mods: { state: 'active' },
// content: 'hello'
// }
// ]
// }
// ]
// }
```
### Custom naming scheme
```js
var bemmet = require('bemmet');
var abbreviation = 'b1>__e1*2>b3--islands+--active';
var bemjson = bemmet.stringify(abbreviation, {
naming: {
elem: '__',
mod: '--'
}
});
console.log(bemjson);
// {
// block: 'b1',
// content: [
// {
// elem: 'e1',
// content: [
// {
// block: 'b3',
// mods: { islands: true },
// content: {}
// },
// {
// block: 'b1',
// mods: { active: true },
// content: {}
// }
// ]
// },
// {
// elem: 'e1',
// content: [
// {
// block: 'b3',
// mods: { islands: true },
// content: {}
// },
// {
// block: 'b1',
// mods: { active: true },
// content: {}
// }
// ]
// }
// ]
// }
```
### API
```js
bemmet(abbreviation, [parentBlock], [options]); // object
bemmet.stringify(abbreviation, [parentBlock], [options]); // string
```
`parentBlock` is used to explicitly define context for shortcuts like `__elem` when there's no parent block in abbreviation itself.
`options.naming` is used to configure BEM naming scheme. For details please refer to [bem-naming](https://en.bem.info/tools/bem/bem-naming/).
For `stringify()` method it's possible to configure indentation and quotes via `options.indent` (string) and `options.singleQuotes` (boolean) params.