angular-templatecache-loader-2

Angular templatecache webpack loader

This repo adds the

Puts HTML files to Angular $templateCache.

Features

1. You can use ng-include directives with require syntax
2. You will always have the content of the file in assigned variable

Install

You can install loader using npm:

npm i angular-templatecache-loader

Examples

main.js

var myTemplate = require('./src/myTemplate.html');  // You will have your template in myTemplate variable

index.html

<div ng-include="'src/myTemplate.html'"></div>

Options

1. module - name of angular module (default is ng)

  {
    test: /\.html$/,
    loader: "angular-templatecache-loader?module=app"
  }

1. prefix - add prefix to all file names

  {
    test: /\.html$/,
    loader: "angular-templatecache-loader?prefix=/public/src"
  }

1. relativeTo - remove a string from the path

relativeTo is used to strip a matching prefix from the path of the input html file.

  {
    test: /\.html$/,
    loader: "angular-templatecache-loader?relativeTo=/public/"
  }

The above will remove the "/public/" from the generated templateUrl path.

1. You can also use context in webpack to pass correct template url. See Context example

var app = path.join(__dirname, 'app');
 
module.exports = {
  context: app
}