0.3.1 • Published 7 years ago
laravel-elixir-ngtemplatecache v0.3.1
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-templatecachehttps://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