ガルプとベーベルを監視すると、徐々に遅くなっていく - ギャルプ、ブラウジング、バーベリ、監視

watchifyが変更を検出するたびに、バンドル時間が遅くなります。 gulpタスクに何か問題があるはずです。誰でもアイデアはありますか？

gulp.task("bundle", function() {
var bundle = browserify({
debug: true,
extensions: [".js", ".jsx"],
entries: path.resolve(paths.root, files.entry)
});

executeBundle(bundle);
});

gulp.task("bundle-watch", function() {
var bundle = browserify({
debug: true,
extensions: [".js", ".jsx"],
entries: path.resolve(paths.root, files.entry)
});

bundle = watchify(bundle);
bundle.on("update", function(){
executeBundle(bundle);
});
executeBundle(bundle);

});

function executeBundle(bundle) {
var start = Date.now();
bundle
.transform(babelify.configure({
ignore: /(bower_components)|(node_modules)/
}))
.bundle()
.on("error", function (err) { console.log("Error : " + err.message); })
.pipe(source(files.bundle))
.pipe(gulp.dest(paths.root))
.pipe($.notify(function() {
console.log("bundle finished in " + (Date.now() - start) + "ms");
}))
}

回答：

これと同じ問題があり、環境変数DEBUGをbabelに設定して調査しました。例えば。：

$ DEBUG=babel gulp

デバッグ出力を調べた後、babelifyが変換を複数回実行していることに気付きました。

原因は、バンドルが実行されるたびに実際に変換を追加したことです。あなたは同じ問題を抱えているようです。

移動する

.transform(babelify.configure({
ignore: /(bower_components)|(node_modules)/
}))

中から executeBundle タスクに。新しい bundle-watch このように書くことができます：

gulp.task("bundle-watch", function() {
var bundle = browserify({
debug: true,
extensions: [".js", ".jsx"],
entries: path.resolve(paths.root, files.entry)
});

bundle = watchify(bundle);
bundle.transform(babelify.configure({
ignore: /(bower_components)|(node_modules)/
}))
bundle.on("update", function(){
executeBundle(bundle);
});
executeBundle(bundle);
});