使用browserify和gulp運行多個轉換

Question

我使用browserify和gulp將javascript代碼捆綁到我的web應用程序中，並且我使用babelify將代碼轉換爲es6兼容，如下所示。現在

gulp.task('js',function(){ 
var bundleStream = browserify(config.paths.mainJs) 
    .transform("babelify", {presets: ["es2015", "react"]}) 
    .bundle() 
    .on('error',console.error.bind(console)) 

bundleStream 
    .pipe(source('compiled.js')) 
    .pipe(buffer()) 
    .pipe(uglify()) 
    .pipe(rename('compiled.min.js')) 
    .pipe(gulp.dest(config.paths.dist + '/js')) 
}); 

，我意識到我需要使用browserify，墊片，並根據文檔用它包入的package.json以下JSON方式：

{ 
    "browserify": { 
    "transform": [ "browserify-shim" ] 
    } 
} 

是否有使用gulp使用多個轉換的方法？

如果（是）{

什麼是正確的語法？在這種情況下，爲了創建最終捆綁包，它們的指定順序是否重要？

}

其他{

如果我再指定墊片轉變成的package.json，但我一直在babelify轉變爲gulpfile，將有問題的時候browserify產生最終的包嗎？這兩個變換都會執行嗎？

}

謝謝！

Answer 1

我猜你的設置很好，但是如果你所有的轉換都在同一個地方，就會更清楚，更容易理解發生了什麼。我會把它們放在你的大文件中，並且在你的瀏覽器 - 勻場轉換之前進行你的babelify轉換：

var browserifyShim = require('browserify-shim'); // <--require statement at top 
// gulp.task........... 
var bundleStream = browserify(config.paths.mainJs) 
    .transform("babelify", {presets: ["es2015", "react"]}) 
    .transform(browserifyShim) // <-- put your browserify-shim transform here. 
    .bundle() 
    .on('error',console.error.bind(console)) 
// Rest of gulpfile