Replace build blocks with js or css contact in HTML. Like useref but done right.
npm install gulp-concat-replaceshell
npm install --save-dev gulp-concat-replace
`
Put some blocks in your HTML file:
`html
or
`
name is the name of the block, and css or js.
API
$3
#### options
Type: object
- {String} prefix - 合并和文件名的前缀,默认值:"concat".
- {String} base - 如果页面引入路径是以“/”开始,相对应于gulpfile.js目录,默认“../”.
- {Object} output - 合并后文件的存储路径,包括css和js的路径(相对于gulpfile.js文件).默认值:
`json
{"js":"./tmp/js","css":"./tmp/css"}
`
Example
index.html:
`html
`
gulpfile.js:
`javascript
var gulp = require('gulp');
var concatreplace = require('gulp-concat-replace');
gulp.task('default', function() {
gulp.src('index.html')
.pipe(concatreplace({
prefix:"concat",
base:"../",
output:{
css:"./build/css",
js:"./build/js"
}
}))
.pipe(gulp.dest('build/'));//html替换后的目录
});
`
Result:
`html
`
`html
相关目录
|-gulpfile.js
|-build
|--css
|---concat1.css
|--js
|---contact2.js
|-index.html
``