Package Exports

laravel-mix-angular-templatecache

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (laravel-mix-angular-templatecache) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Laravel Mix Angular templateCache

npm

This extension adds support for angular-templatecache-webpack-plugin to Laravel Mix. The package speeds up your AngularJS app by automatically combining, concatenating, registering and caching your AngularJS HTML templates in the $templateCache.

Install | Usage | Plugin Options and Defaults

Install

Install with npm or yarn

  npm i --save laravel-mix-angular-templatecache

  yarn add laravel-mix-angular-templatecache

Usage

Require the extension inside your webpack.mix.js and call mix.cacheTemplates('src/templates/**/*.html', pluginOptions), like so:

// webpack.mix.js

const mix = require('laravel-mix');

require('laravel-mix-angular-templatecache');

// this will generate a file public/templates.js 
mix.cacheTemplates('src/templates/**/*.html'); 

// Or:

// see more options and defaults below
mix.cacheTemplates('src/templates/**/*.html', {
    outputFilename: 'another/folder/myTemplates.js', // will output at public/another/folder/myTemplates.js
});

This will generate the file public/templates.js containing the following:

// templates.js (sample output prettified)

angular.module("templates").run([$templateCache,
  function($templateCache) {
    $templateCache.put("template-file-01.html",
      // content of template-file-01.html (escaped)
    );
    $templateCache.put("template-file-02.html",
      // content of template-file-02.html (escaped)
    );
    // etc...
  }
]);

Include this file in your app and AngularJS will use the $templateCache when available.

ℹ️ This plugin will NOT create a new AngularJS module by default, but use a module called templates. If you want to create a new module, set options.standalone to true.

Tip: mix.cacheTemplates(), mix.angularTemplateCache() and mix.templateCache() are aliases. All commands work for all examples in this section.

Plugin Options and Defaults

Name	Type	Default	Description
`outputFilename`	`{String}`	`'public/templates.js'`	The path/filename.js where the output file should be saved.
`root`	`{String}`	`undefined`	Prefix for template URLs.
`module`	`{String}`	`'templates'`	Name of the existing AngularJS module.
`standalone`	`{Boolean}`	`false`	Create a new AngularJS module, instead of using an existing one.
`escapeOptions`	`{Object}`	{}	An object with jsesc-options. See jsesc for more information.
`templateHeader`	`{String}`	`*See below`	Override template header.
`templateBody`	`{String}`	`*See below`	Override template body.
`templateFooter`	`{String}`	`*See below`	Override template footer.

For more information about angular-templatecache-webpack-plugin configurations please refer to their documentation.

Default Templates

templateHeader: js 'angular.module("<%= module %>"<%= standalone %>).run(["$templateCache", function($templateCache) {'
templateBody: js '$templateCache.put("<%= url %>","<%= contents %>");'
templateFooter:
'}]);'

JSPM