ReactJS Browserify和Babel

Question

對不起，如果這聽起來是一個非常基本的問題，但我是新的吞嚥和browserify。我有一個大口任務文件

var gulp = require('gulp'); 
var babel = require('gulp-babel'); 
var concat = require('gulp-concat'); 
var browserify = require('browserify'); 
var babelify = require('babelify'); 
var source = require('vinyl-source-stream'); 

gulp.task('bundle', function(){ 
    return browserify({ 
     extensions: ['js', 'jsx'], 
     entries: 'assets/js/src/main.js' 
    }) 
     .transform(babelify.configure({ 
      ignore: /(bower_components)|(node_modules)/ 
     })) 
     .bundle() 
     .on('error', function(err){ 
      console.log('Error : ' + err.message); 
     }) 
     .pipe(source('app.js')) 
     .pipe(gulp.dest('assets/js/')); 
}); 

// Watch JS/JSX and Sass files 
gulp.task('watch', function() { 
    gulp.watch('assets/js/src/**/*.{js,jsx}', ['bundle']); 
}); 

在這裏，我想transpile我的代碼ES2015，但我不知道資產/ src目錄/ main.js文件中browserify任務應該擁有什麼。我的問題是，main.js只是browserify的入口點？如果是，那麼它應該有什麼？

Answer 1

entries將是你的反應程序的入口點，以便在那裏reactDOM渲染完成並在你的應用程序中聲明，例如，它可以包含：

ReactDOM.render(
    <h1>Hello, world!</h1>, 
    document.getElementById('example') 
);