Chạy nhiều biến đổi trên gói gulp/browserify

Question

Tôi có một thành phần React mà tôi đã xuất sang một tệp bó. Tôi đã chuyển đổi thành công nó bằng cách sử dụng babelify, tuy nhiên, bây giờ tôi muốn chạy envify trên nó. Tôi không thể tìm ra cách để chạy nhiều biến đổi bằng cách sử dụng browserify. Tôi nghĩ rằng nó phải là có thể, nhưng tôi không thể nói nếu cú ​​pháp của tôi là hơi tắt hoặc nếu tôi cần phải viết một biến đổi tùy chỉnh hoặc nếu tôi nên chỉ định các biến đổi trong package.json của tôi. Đây là mã trong tệp gulp của tôi:

var bundleComponent = function(bundler, source, component) { 
    //bundler is just browserify('./client/components/TVScheduleTab/render.js') 

    gutil.log('Bundling ' + component) 

    return bundler 
    //this throws an error 
    .transform(babelify, envify({ 
     NODE_ENV: 'production' 
    })) 
    .bundle() 
    .on('error', function(e){ 
     gutil.log(e); 
    }) 
    .pipe(source) 
    .pipe(gulp.dest('output/')); 
}; 

Answer 1

Bạn đã thử chuỗi không? giải pháp đúng là trong ý kiến ​​

var bundleComponent = function(bundler, source, component) { 
    //bundler is just browserify('./client/components/TVScheduleTab/render.js') 

    gutil.log('Bundling ' + component) 

    return bundler 
    //this throws an error 
    .transform(babelify) 
    .transform(envify({ 
     NODE_ENV: 'production' 
    })) 
    .bundle() 
    .on('error', function(e){ 
     gutil.log(e); 
    }) 
    .pipe(source) 
    .pipe(gulp.dest('output/')); 
}; 

Answer 2

Mặc dù câu trả lời này xuất hiện sau khi trả lời chấp nhận, và chấp nhận phần nào bao gồm các câu hỏi, tôi muốn làm cho nó rõ ràng mà không cần phải điều hướng thông qua các vấn đề github liên kết.

Chaining, đặc biệt là với envify, nên hình như:

// NOTE: the "custom" part 
var envify = require('envify/custom'); 

gulp.task('build-production', function() { 
    browserify(browserifyOptions) 
     .transform(babelify.configure(babelifyOptions)) 
     .transform(envify({ 
      NODE_ENV: 'production' 
     })) 
     .bundle() 
     .on('error', handleErrors) 
     .pipe(source('app.js')) 
     .pipe(buffer()) 
     .pipe(uglify({ mangle: false })) 
     .pipe(gulp.dest('./build/production/js')); 
});