Bundle mehrere Dateien mit großen Schluck und browserify

Question

Ich habe eine Projektstruktur, die so etwas wie das ist:

src 
    |html 
    |javascript 
    |file_one.js 
    |file_two.js 
    |styles 
dist 
gulpfile.js 

Meine Frage ist: Wie kann ich alle Dateien im „javascript“ Ordner in der Wurzel „dist“ bündeln Folder umbenennen die Bundle-Dateien auf folgende Weise?

file_one.js ----> file_one.bundle.js file_two.js ----> file_two.bundle.js

ich folgendes tun, aber ich kann das Bündel nicht gesetzt Dateien in den Root-Ordner "dist", und ich weiß nicht, ob das der schönste Weg ist.

gulp.task("bundler", function(){ 
    var src_arr = ['src/javascript/file_one.js', 'src/javascript/file_two.js']; 
    src_arr.forEach(function(file) { 
    var bundle = browserify([file]).bundle(); 
    bundle.pipe(source(file.substring(0,file.indexOf('.')) + ".bundle.js")) 
     .pipe(gulp.dest('dist/')); 
    }); 
}); 

Jede Hilfe wird geschätzt. Dank

Answer 1

Ich denke, das mehr ist ein langer Kommentar als „Antwort“ ...

Verschiedene Wege mit mehreren browserify Einstiegspunkte zu behandeln ist gut https://wehavefaces.net/gulp-browserify-the-gulp-y-way-bb359b3f9623 in Browserify - multiple entry points und in @Hafiz Ismail bedeckt.

Da Sie mit zwei wissen Dateien zu tun sind eher als ein glob, könnte die gulpiest Lösung ein browserifying lazypipe (https://github.com/OverZealous/lazypipe) einzurichten sein, und rufen Sie das aus zwei getrennten Aufgaben - eine wäre

gulp.task('first', function(){ 
    gulp.src('src/javascript/file_one.js') 
     .pipe(browserifyingLazypipe()) 
}; 

(ich gebe offen zu, dass ich nicht versucht haben, in einem lazypipe mit browserify)

ein Gulpy Weg, um die Umbenennung zu tun ist, verwenden gulp-rename

.pipe(rename({ 
    extname: '.bundle.js' 
})