Use npm as a build tool to load all your jade/html templates into your $templateCache.
$ npm-html2js -i 'src/**/*.jade' -o 'dist/template.js'
angular.module('template.js', []);
.run(['$templateCache', function($templateCache) {
.$templateCache.put('files/file1.tpl.jade',
'<div>\n' +
' <h1>Hello World from file1!</h1>\n' +
'</div>')
.$templateCache.put('files/file2.tpl.jade',
'<div>\n' +
' <h1>Hello World from file2!</h1>\n' +
'</div>')
.$templateCache.put('files/subfolder/subfile1.tpl.jade',
'<div>\n' +
' <h1>Hello World from subfile1!</h1>\n' +
'</div>')
.$templateCache.put('files/subfolder/subfile2.tpl.jade',
'<div>\n' +
' <h1>Hello World from subfile2!</h1>\n' +
'</div>')
}]);
Via npm:
npm install --save-dev npm-html2js
And load it in your build process in your package.json
:
"scripts": {
"build": "npm-html2js -i 'files/**/*.html' -o 'dist/template.js'"
},
If running on Windows, make sure to replace the single quotes with escaped double quotes:
"scripts": {
"build": "npm-html2js -i \"files/**/*.html\" -o \"dist/template.js\""
},
Path to your templates. The module supports globbing so you can use path like src/**/*.tpl.html
example:
npm-html2js -i 'files/**/*.tpl.html'
Path to the expected output file.
example:
npm-html2js ... -o 'dist/template.js'
The name of the parent Angular module for each set of templates. Defaults to the task target prefixed by templates.js
example:
npm-html2js ... -m 'myModule'
if the filename ends with .jade
, the task will automatically render file's content using Jade then comile into JS
The prefix relative to the project directory that should be stripped from each template path to produce a module identifier for the template. For example, a template located at src/projects/projects.tpl.html
would be identified as just projects/projects.tpl.html
.
example:
npm-html2js ... -b 'src'
Minify the html before compiling to JS
example:
npm-html2js ... --minify
Display the command line options