handlebars-react

    0.0.16 • Public • Published

    handlebars-react NPM Version Build Status Dependency Status

    Compile Handlebars templates to React.

    Compile this:

    <div>
        text1
        {{variable1}}
        {{#if variable2}}<span>text2</span>{{else}}text3{{/if}}
        <span data-attr="{{#if variable3}}value1{{/if}} value2">text4</span>
    </div>

    into this:

    React.DOM.div(null,
        "text1",
        this.props.variable1,
        this.props.variable2 ? React.DOM.span(null,
            "text2"
        ) : "text3",
        React.DOM.span({"data-attr":(this.props.variable3 ? "value1" : "") + " value2"},
            "text4"
        )
    );

    Installation

    Node.js >= 5 is required; < 5.0 will need an ES6 compiler. Type this at the command line:

    npm install handlebars-react

    Usage

    Server/Browserify

    var HandlebarsReact = require("handlebars-react");
     
    new HandlebarsReact(options)
    .compile("<h1>{{title}}</h1>")
    .then(result => console.log("done!"));

    UMD/AMD/etc

    Accessible via define() or window.HandlebarsReact.

    Options

    options.beautify

    Type: Boolean
    Default value: false
    When true, output will be formatted for increased legibility.

    options.env

    Type: String
    Default value: undefined
    Option presets for your target environment: "development" or "production". Preset options can be overridden.

    options.normalizeWhitespace

    Type: Boolean
    Default value: false
    See handlebars-html-parser.

    options.processCSS

    Type: Boolean
    Default value: false
    See handlebars-html-parser.

    options.processJS

    Type: Boolean
    Default value: false
    See handlebars-html-parser.

    options.useDomMethods

    Type: Boolean
    Default value: false
    When true, available React.DOM convenience functions will be used instead of React.createElement().

    Roadmap Features

    • convertHbsComments to JavaScript block comments (or HTML comments?)
    • convertHtmlComments to JavaScript block comments
    • ignoreComments option when React supports such (react#2810)
    • trimWhitespace option to remove spaces between elements (<tag> a word <tag> to <tag>a word<tag>)?

    Changelog

    • 0.0.1–0.0.16 pre-releases

    Install

    npm i handlebars-react

    DownloadsWeekly Downloads

    9

    Version

    0.0.16

    License

    MIT

    Last publish

    Collaborators

    • avatar