# enb-bemify-templates

[![Build Status][travis-image]][travis-url]

An [ENB]("https://ru.bem.info/toolbox/enb/") tech which compiles BH and BEMXJST templates to the javascript BEM module definitions. 

## Description
This tech takes provided BH, BEMHTML or BEMTREE template files, and converts it to the ES2015 javascript code. Export name for templates and type must be specified in the required options **exportName** and **type** accordingly.

For example, we have next template files:

**BH**
```javascript
    bh.match('block', (ctx) => {
        ctx.tag('h1');
        ctx.content({
            elem: 'hello-text',
            message: ctx.message
        })
    })
```

**BEMHTML**
```javascript
    block('block').elem('hello-text')(
        tag()('strong'),
        content((ctx) => {
            return ctx.message
        })
    )
```

**BEMTREE**
```javascript
    block('block')(
        extend()({
            'ctx.msg': 'Hello world!!!'
        })
    )
```

This files will be compiled to the templates files contained the next code:

**BH**
```javascript
    modules.define("templates__bh", [], (_provide) => {
        _provide(function (exported){
            return exported
        },({
            default: (BH) => {
                const bh = BH
                bh.match('block', (ctx) => {
                    ctx.tag('h1');
                    ctx.content({
                        elem: 'hello-text',
                        message: ctx.message
                    })
                })
            }
        }))
    })
```

**BEMHTML**
```javascript
    modules.define("templates__bemhtml", [], (_provide) => {
        _provide(function (exported){
            return exported
        },({
            default: () => {
                block('block').elem('hello-text')(
                    tag()('strong'),
                    content((ctx) => {
                        return ctx.message
                    })
                )
            }
        }))
    })
```

**BEMTREE**
```javascript
    modules.define("templates__bemtree", [], (_provide) => {
        _provide(function (exported){
            return exported
        },({
            default: () => {
                block('block')(
                    extend()({
                        'ctx.msg': 'Hello world!!!'
                    })
                )
            }
        }))
    })
```

## Usage
If you want to use this tech in your project, you should to:

**Firstly** install this tech from the [npm](https://www.npmjs.com/) repository, 
```
    npm install --save-dev enb-bemify-templates
```

**Next** configure your tech into the *.enb/enb-make.js* file for needed template types:
```javascript
    //.enb/enb-make.js
    nodeConfig.addTechs(require('enb-bemify-templates'), {
        target: '?.bh.js',
        suffixes: ['bh.js'],
        exportName: "BH",
        type: "BH"        
    })

    nodeConfig.addTechs(require('enb-bemify-templates'), {
        target: '?.bemhtml.js',
        suffixes: ['bemhtml.js'],
        exportName: "BEMHTML",
        type: "BEMHTML"        
    })

    nodeConfig.addTechs(require('enb-bemify-templates'), {
        target: '?.bemtree.js',
        suffixes: ['bemtree.js'],
        exportName: "BEMTREE",
        type: "BEMTREE"        
    })
```

## License
MIT, see [LICENSE](/LICENSE) for details.

[travis-url]: https://travis-ci.org/b-tools/enb-bemify-templates
[travis-image]: https://travis-ci.org/b-tools/enb-bemify-templates.svg?branch=master