Skip to content

Including templates in the build

Cláudio Silva edited this page Jan 5, 2015 · 4 revisions

Why is templates processing included in the builder?

So that you can include in your build only the templates that are actually required by your application (i.e. templates from unused modules are not included).

Requiring templates

To declare a dependency between your module and one or more templates, include one (or more) template build-directives in the javascript source files of your project.

A single template:

//# template ("template/path/and/filename.html")

You can use any extension you want for your templates (ex: .html, .jade).

Multiple templates

//# template ("path1/filename1.html", "../path2/filename2.html")

You can also use multiple template references.

Glob patterns

//# template ('path/**/*.html')

How it works

Whenever a module is included in a build, all template build-directives present in any of the files that comprise the module are processed and the required template paths are recorded.

This means that each individual source file may specify its template requirements.

Duplicate template directives are ignored, so each template is included only once.

The specified path should be a relative path (not starting with /); it will be relative to the file containing the directive.

Handling the required templates

All required template paths are recorded in an array on the Gruntfile's configuration. The property on which it will be saved can defined in the task options and defaults to 'angularTemplates'.

The configuration property can then be used by other Grunt tasks, which can do whatever you want with the required templates (ex: concatenated them, compile JADE, etc).

The list of templates is sorted by the order in which they are required and takes into consideration the interconnected dependencies of your source code.

Templates that are required by scripts that are not included in the build (i.e. not part of the dependency graph of your application) will be ignored.

Examples

See Configuration Examples.