gulp-inject-html
Assuming your AMD module depends on a html file(load with textjs), and you want pack the module and the html together, then this is what are you looking for!
gulp-inject-html will go through your code and figure out the html dependences, and then inject the html content into your module as a variable!
for more information, see Usage section below.
Install
$ npm install --save-dev gulp-inject-html
Usage
prepare your files
- templates
- index.html
- views
- index.js
- data-main.js
prepare your code
if you use a path-builder just as i do as below, then you need to provide "templates" which is the folder that holds your html templates for gulp-inject-html. gulp-inject-html will lookup respective html file and inject it into your module.
And if your path-builder is different from mine, you may need to tell gulp-inject-html what it looks like via "pathBuilder"(array for muti, or string for single one).
/*** * js in data-main js **/window{ return "text!../templates/" + fileName );} /*** * views/index.js **/
or you just use your "text" plugin without any decoration like the following, then you need provide "baseUrl" (an option for requirejs) for gulp-inject-html, gulp-inject-html will lookup respective html file relatively.
/*** * template/index.html **/ 给她投票
prepare your gulp task
/*** * in gulpfile.js **/var injecthtml = require('gulp-inject-html');... gulp.task( 'build', function(){ return gulp.src( './views/*.js' ) ) .pipe( injecthtml({ templates: 'templates', baseUrl: 'views', pathBuilder: [ '_buildTextPath', '_buildTextPath2' ] })) .pipe( gulp.dest( './buld/views' ));}) // templates: the folder that hold your html templates. // gulp-inject-html will read the html file that has the same name as your module's.
build result
/*** * build/views/index.js **/
options
templates
Type: string. Refer to Usage section.
baseUrl
Type: string. Refer refer to Usage section.
pathBuilder
Type: string or array. Refer to Usage section.
htmlClean
Type: object
gulp-inject-html use htmlclean to handle your html template. htmlClean
is the options for htmlclean.
Note
- DO NOT put code before define([],function(){}) call
- your html template file MUST has the same name as your module's