如何設置gulp將多個文件合併爲一個？

Question

這似乎是一個非常簡單的問題，但花了最近3個小時研究它，發現如果不使用watchify，它可能會在每次保存新文件時變慢。

這是我的目錄樹：

gulpfile.js 
package.json 

www/ 
    default.htm 
    <script src="toBundleJsHere/file123.js"></script> 

    toBundletheseJs/ 
    componentX/ 
     file1.js 
    componentY/ 
     file2.js 
    componentZ/ 
     file3.js 

    toPutBundledJsHere/ 
     file123.js 

要求。 在每個創建或保存我想這個文件被rebundled爲toBundleJsHere/

文件夾toBundleTheseJs/中的文件的什麼我需要在我package.json文件中包括哪些內容？

什麼是最低限度我需要寫入我的吞噬文件？

這應該儘可能快，所以認爲我應該使用browserify和watchify。我想了解最小步驟，所以使用像jspm這樣的包管理器已經過分了。

感謝

Answer 1

首先，你應該聽在所需目錄的變化：

watch(['toBundletheseJs/**/*.js'], function() { 
     gulp.run('bundle-js'); 
    }); 

然後bundle-js任務應該捆綁你的文件。推薦的方法是gulp-concat：

var concat = require('gulp-concat'); 

gulp.task('bundle-js', function() { 
    return gulp.src('toBundletheseJs/**/*.js') 
    .pipe(concat('file123.js')) 
    .pipe(gulp.dest('./toPutBundledJsHere/')); 
});