0.5.4 • Published 8 years ago

handlebars-template-loader-fixer v0.5.4

Weekly downloads
1
License
MIT
Repository
github
Last release
8 years ago

handlebars-template-loader

A Handlebars template loader for Webpack

// Get Handlebars instance var Handlebars = require('handlebars-template-loader').Handlebars;

Handlebars.registerHelper('list', function(items, options) { var out = "";

for(var i=0, l=items.length; i<l; i++) { out = out + "" + options.fn(itemsi) + ""; }

return out + ""; });

Handlebars.registerHelper('link', function(text, url) { text = Handlebars.Utils.escapeExpression(text); url = Handlebars.Utils.escapeExpression(url);

var result = '' + text + '';

return new Handlebars.SafeString(result); });

<br>
```javascript
// File: main.js

// Include template helpers
require("./helpers.js");
module.exports = {
    //...
    
    module: {
        loaders: [
            {
                test: /\.hbs$/,
                loader: "handlebars-template-loader",
                query: {
                    prependFilenameComment: __dirname,
                }
            }
        ]
    }
};
module.exports = {
    //...
    
    module: {
        loaders: [
            //...
            { test: /\.hbs/, loader: "handlebars-template-loader" },
            { test: /\.jpg/, loader: "file-loader" },
            { test: /\.png/, loader: "url-loader?mimetype=image/png" },
        ]
    }
};
<!-- Using root = undefined => no translation -->
<img src="/not_translated.jpg">

<!-- Using root = 'images' => require('images/image.jpg') -->
<img src="/image.jpg">
module.exports = {
    //...
    
    module: {
        loaders: [
            {
                test: /\.hbs$/,
                loader: "handlebars-template-loader",
                query: {
                    attributes: []
                }
            }
        ]
    }
};

Name: {{name}} Surname: {{surname}}

<div class="wiki">
    <h3>Introduction</h3>
    @include('intro.htm')
    <h3>Authors</h3>
    @include('authors.htm')
</div>
<p>Lorem ipsum</p>
@br(3)
<p>Sit amet</p>
@nl()
module: {
    loaders: {
        // ...
        { test: /\.hbs/, loader: "handlebars-template-loader" },
    }
},

macros: {
    copyright: function () {
        return "'<p>Copyright FakeCorp 2014 - 2015</p>'";
    }
}

}

<br>
We then invoke our macro from within the template as usual.

<br>
```html
<footer>
    @copyright()
</footer>
module: {
    loaders: {
        // ...
        { test: /\.html$/, loader: "underscore-template-loader" },
    }
},

macros: {
    header: function (size, content) {
        return "'<h" + size + ">" + content + "</h" + size + ">'";
    }
}

}

<br>
```html
@header(1, 'Welcome')
<p>Lorem ipsum</p>
@header(3, 'Contents')
<p>Sit amet</p>

Released under the MIT license.