如何寫一個能在gulp build pipe中任意更改src內容的函數

gulp在前端自動化構建中很是好用,有很是豐富的能夠直接拿來使用的plugin,完成咱們平常構建工做。css

可是萬事沒有十全十美可以徹底知足本身的需求,這時咱們就要本身動手寫一個小的函數,用於在gulp stream pipeline中執行咱們想要的動做,好比我有一個需求在build後將gulp-inject插入的assets url修改成laravel的一個helper以便識別不一樣的運行環境:若是是staging環境則不要上cdn方便調試,若是是生產環境則將url修改成cdn的url,實現網站快速飛起來的夢想。怎們辦呢?前端

一個可行的偷懶方案是使用gulp-through2 plugin,不須要咱們寫完整的plugin,而只需關注咱們想要的功能:laravel

https://meanstack.wordpress.com/2015/10/09/write-your-own-gulp-module-with-example-as-image-cache-buster-for-css/gulp

function (file, enc, callback) {
var stringData = String(file.contents);
//loop for each supported images types
for (var i = 0; i < module.exports.supportedImages.length; i++) {
//add version of image
stringData = cssImageBusterForOneImageType(stringData, module.exports.supportedImages[i]);
}
var finalBinaryData = new Buffer(stringData, 「binary」);
file.contents = finalBinaryData;
callback(null, file);
}
var jsOutputFile = 「combined.js」;
var jsOutputFolder=」./dest/js」
var jsSrc=[「./src/js/**/*.js」];
gulp.task(‘jsconcat’, function () {
gulp.src(jsSrc)
.pipe(uglifyJs())
.pipe(concat(jsOutputFile, {newLine: ‘ ‘}))
.pipe(jshint())
.pipe(through.obj(imagebuster.jsImageBuster))
.pipe(gulp.dest(jsOutputFolder));
});
相關文章
相關標籤/搜索