Obserwuj w/gulp i babel dostaje stopniowo wolniej

Question

Za każdym razem, gdy watchify wykrywa zmianę, czas pakowania jest wolniejszy. Coś jest nie tak z moim zadaniem. Czy masz jakieś pomysły?

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'); 
     })) 
} 

Answer 1

Miałem ten sam problem i zbadałem go, ustawiając zmienną środowiskową DEBUG na babel. np .:

$ DEBUG=babel gulp 

Po sprawdzeniu wyników debugowania zauważyłem, że babelify wielokrotnie przeprowadzało transformacje.

Sprawca był taki, że faktycznie dodałem transformację za każdym razem, gdy pakiet został wykonany. Wydaje się, że masz ten sam problem.

Przesuń

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

od wewnątrz executeBundle do zadań. Nowy bundle-watch można zapisać tak:

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); 
});