ガルプ、Reactify、およびBabelifyが一緒に変換しない

Question

これは私のgulpfileコードです：（私が書いている変換

gulp.task('react', function() { 
    browserify('app/src/main.jsx') 
    .transform(reactify) 
    .transform(babelify) 
    .bundle() 
    .pipe(source('app.js')) 
    .pipe(streamify(uglify())) 
    .pipe(gulp.dest('dist/js/')); 
}); 

のみ最初の文の実行を変換し、そのためのは、追加の欠如にエラーがスローされますES6とJSXは反応します）。

私は完全に迷っており、本当に助けに感謝します。

Answer 1

Reactifyは使用しないでください。あなたは現在のバージョンは言わないが、Babel 6の時点では、 "プリセット"はコンパイルを達成するための標準的な方法です。

はあなたにもBabelifyが最新であることを確認する必要があり

npm install save-dev babel-preset-react babel-preset-es2015 

次を実行します。その後、Gulpの設定は

var babelify = require("babelify"); 
gulp.task('react', function() { 
    browserify('app/src/main.jsx') 
    .transform(babelify, {presets: ["es2015", "react"]}) 
    .bundle() 
    .pipe(source('app.js')) 
    .pipe(streamify(uglify())) 
    .pipe(gulp.dest('dist/js/')); 
}); 

となります。詳細はoptions pageを参照してください。