gulp：ブラウジングしてファイルを連結する

Question

ファイルをブラウズして、別のファイルと連結する必要があります。私は下のgulpコードを試しましたが、正しく動作していません。
mymodule.jsを変更してgulpを実行すると、gulpをもう一度実行しない限り、これらの変更はバンドルファイルに表示されますが、連結ファイルには表示されません。
これは、連結ステップがバンドル・ステップが完了するのを待っておらず、以前にブラウズされたバンドルを取るようなものです。 私は一口で初心者だとして、私は私の一気ロジックに問題があると確信している...

私gulpfileは次のとおりです。

var gulp = require('gulp'); 
var browserify = require('browserify'); 
var source = require('vinyl-source-stream'); 
var concat = require('gulp-concat'); 

gulp.task('default', function() { 
    var b = browserify('src/mymodule.js') 
    .bundle() 
    .pipe(source('mymodule-bundle.js')) 
    .pipe(gulp.dest('src')); 

    gulp.src([ 
     'bower_components/porthole/src/porthole.min.js', 
     'src/mymodule-bundle.js' 
    ]) 
    .pipe(concat('app.js')) 
    .pipe(gulp.dest('dist')); 
}); 

おかげ

Answer 1

かのようにです連結ステップは、バンドルステップが完了し、以前にブラウズされたバンドルを取るのを待つことはありません。

これはまさに起こります。 Gulpは非同期で最大同時実行性を備えているので、何かを待つように指示しない限り、すべてがすぐに実行されます。

var gulp = require('gulp'); 
var browserify = require('browserify'); 
var source = require('vinyl-source-stream'); 
var concat = require('gulp-concat'); 

var paths = [ 
'bower_components/porthole/src/porthole.min.js', 
'src/mymodule-bundle.js' 
]; 

gulp.task('default', function() { 
return browserify('src/mymodule.js') 
    .bundle() 
    .pipe(source('mymodule-bundle.js')) 
    .pipe(gulp.dest('src')); 
}); 

gulp.task('default2', function() { 
return gulp.src(paths) 
    .pipe(concat('app.js')) 
    .pipe(gulp.dest('dist')); 
}); 

gulp.task('final', ['default', 'default2']); 

と実行タスク最終たびにあなたがしたい：

gulp.task('bundle', function() { 
    return browserify('src/mymodule.js') 
    .bundle() 
    .pipe(source('mymodule-bundle.js')) 
    .pipe(gulp.dest('src')); 
}); 

gulp.task('default', ['bundle'], function() { 
    return gulp.src([ 
    'bower_components/porthole/src/porthole.min.js', 
    'src/mymodule-bundle.js' 
    ]) 
    .pipe(concat('app.js')) 
    .pipe(gulp.dest('dist')); 
}); 

Answer 2

はこれを試してみてください：

あなたは、その一方が他方に依存がぶ飲みするために、2つのタスクとヒントにタスクを分割することができますバンドルを作成します。

Answer 3

実際にあなたが他の回答で述べたように、あなたのタスクを分割する必要はありません。

var gulp = require('gulp'); 
var browserify = require('browserify'); 
var source = require('vinyl-source-stream'); 
var concat = require('gulp-concat'); 
var merge = require('merge-stream'); 
var buffer = require('vinyl-buffer'); 

gulp.task('default', function() { 
    var b = browserify('src/mymodule.js') 
      .bundle() 
      .pipe(source('mymodule-bundle.js')) 
      .pipe(buffer()) 
      // remove this line if you don't need 'mymodule-bundle.js' to be saved at all 
      .pipe(gulp.dest('src')); 

    return merge(b, gulp.src('bower_components/porthole/src/porthole.min.js')) 
      .pipe(concat('app.js')) 
      .pipe(gulp.dest('dist')); 
});