This Brunch plugin copies a tree of .html templates into application's index.html file as a bunch of <script type="text/ng-template" id="FILENAME"> tags.

Install locally under your project directory.

npm install --save-dev text-ng-templates-brunch

By default, all html files found under your app tree will be copied and inserted as script tags just before closing body tag. Just make sure you follow conventions (see configuration below), and ensure that plugin name is listed as dependency in your package.json.

Each of your angular template html file, needs to have a unique name; otherwise generated script tag will be overwritten.

This plugin works "out of the box", if you follow usual conventions:

• your application's index.html file is located under public/index.html
• you use .html extension for your angular templates

By default script tags will be added just before closing body tag.

If you want to change default behaviour, you can use following options in brunch-config.js.

exports.plugins = {
    textNgTemplates: {
        insertTo: './path/to/target.html' // String
        // default path is './public/index.html'
    }
};

Consider following file tree.

app/
    directives/
        a-directive.html
        a-directive.js
    index.html

And example a-directive.html file.

<ul>
    <li ng-repeat="...">some code...</li>
</ul>

When your run brunch, all html files will be copied into index.html. The copied file name will be placed as id of the script tag. This will allow you to use this id as a template id for templateUrl.

<script type="text/ng-template" id="a-directive">
<ul>
    <li ng-repeat="...">some code...</li>
</ul>
</script>

Usage in a-directive.js file (example in EcmaScript 6).

'use strict'

export default function aDirective () {
    return {
        templateUrl: 'a-directive'
    };
}

MIT