Question

很抱歉，如果这听起来是一个非常基本的问题，但我是gulp和browserify的新手。我有一个gulp任务文件

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

这里我想将我的代码转换为ES2015，但我不确定browserify任务中的assets / src / main.js文件应该具有什么。我的问题是，main.js只是browserify的入口点吗？如果是，那它应该有什么？

Answer 1

entries将是您的react应用程序的入口点，因此在reactDOM呈现完成的位置以及声明应用程序的位置，例如它可以包含：

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

ReactJS Browserify和Babel

1 个答案: