Skip to content

A Brunch plugin for inserting Angular's directive templates as a bunch of <script> tags into your app's index.html file.

License

Notifications You must be signed in to change notification settings

nestak/text-ng-templates-brunch

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

17 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Angular Text/NgTemplates Plugin for Brunch

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.

Installation

Install locally under your project directory.

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

Usage

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.

Limitations

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

Configuration

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'
    }
};

Example

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'
    };
}

License

MIT

About

A Brunch plugin for inserting Angular's directive templates as a bunch of <script> tags into your app's index.html file.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published