babel-plugin-app-decorators-view-precompile

babel-plugin-app-decorators-view-precompile

Babel Plugin for auto generating code

Installation

$ npm install babel-plugin-app-decorators-view-precompile --save

Usage

Via .babelrc (Recommended)

.babelrc

{
  "plugins": ["app-decorators-view-precompile"]
}

.babelrc options

"plugins": [
    ["app-decorators-view-precompile", {
        "engine": "handlebars"
    }]
]

Via CLI

$ babel --plugins app-decorators-view-precompile script.js

Via Node API

require('babel').transform('code', {
  plugins: ['app-decorators-view-precompile']
});

The goal of this babel-plugin is precompile template with handlebars that is inside of app-decorators @view:

Example

Input:

@view(`
    {{#if foo}}<div>Hello World</div>
    {{else}}
        <div>Hello Mars</div>
    {{/if}}
`)
class Foo {
 
}

Output:

@view({
    "1": function(container, depth0, helpers, partials, data) {
      return "<div>Hello World</div>\n";
    },
    "3": function(container, depth0, helpers, partials, data) {
      return "        <div>hello Mars</div>\n";
    },
    "compiler": [7, ">= 4.0.0"],
    "main": function(container, depth0, helpers, partials, data) {
      var stack1;
    
      return "\n    " + ((stack1 = helpers["if"].call(depth0 != null ? depth0 : {}, (depth0 != null ? depth0.foo : depth0), {
          "name": "if",
          "hash": {},
          "fn": container.program(1, data, 0),
          "inverse": container.program(3, data, 0),
          "data": data
      })) != null ? stack1 : "");
    },
    "useData": true
})
class Foo {
 
}

Tests

git clone https://github.com/SerkanSipahi/app-decorators.git
cd app-decorators/packages/babel-plugin-app-decorators-view-precompile
make install
make test