laravel-elixir-ngtemplatecache
v0.3.1
Published
Laravel Elixir extension for generating AngularJS an templateCache module
Downloads
72
Maintainers
Readme
Laravel Elixir ngTemplateCache
Laravel elixir extension for generation angularjs templatecache module.
Read more about templateCache
- Angularjs API documentation: https://docs.angularjs.org/api/ng/service/$templateCache
- gulp-angular-templatecache: https://github.com/miickel/gulp-angular-templatecache
Features
- Generate template cache module
- So the angularjs could load all template with one http request
- Compress html in production mode
- Generate sourcemap
Install
npm install --save-dev laravel-elixir-ngtemplatecache
Usage
Example Gulpfile.js:
var elixir = require('laravel-elixir');
require('laravel-elixir-ngtemplatecache');
elixir(function(mix) {
mix.ngTemplateCache();
});
All arguments all optional, meaning of them:
src
- template file pattern, these files located inside the base directory and these will be aggregated into one angularjs module, default value:/**/*.html
outputDir
- where to put the generated module, default value:elixir.config.jsOutput
which meanspublic/js
if you left untoched the elixir configurationbaseDir
- base directory for searching template files, default value:elixir.config.assetsDir + 'templates'
which meansresources/assets/templates
in case you haven't configured the elixir in another wayoptions
- configuration options for this plugin and for these 3rdparty libraries used by the plugin.templateCache
- This plugin use the [gulp-angular-templatecache]https://github.com/miickel/gulp-angular-templatecache#api) for the templatecache module generation. You can configure that plugin here. Default options:
{
standalone: true
}
htmlmin
- Options for html minification, you find possible parameter in the html-minifier documentation. Default options:
{
collapseWhitespace: true,
removeComments: true
}
Complex example Gulpfile.js containing all default values:
var elixir = require('laravel-elixir');
require('laravel-elixir-ngtemplatecache');
elixir(function(mix) {
mix.ngTemplateCache('/**/*.html', 'public/js', 'resources/assets/templates', {
enabled: {
htmlmin: true // in production, false in development mode
},
templateCache: {
standalone: true
},
htmlmin: {
collapseWhitespace: true,
removeComments: true
}
});
});
Example Angular Usage:
Include the templates file into your html:
<script src="public/js/templates.js"></script>
And then add the templates
module to the main module of your angularjs application:
angular.module('app', ['templates', '...']);
Use the template:
<ng-include src='foo/bar.html'></ng-include>
This will require a file BASEDIR/foo/bar.html
, so you don't have to put the BASEDIR
inside the url.
Changelog
0.3.1
- Added config option to toggle html-min usage
0.3.0
- Refactor path handling to get the ability to ignore files with gulp/glob patterns
0.2.0
- Upgrade to laravel-elixir 3.0
- Upgrade dependencies
0.1.0
- Initial release
TODO
- Tests
- Source code documentation
License
MIT