Javascript 如何正确包含需求和反应&；吞咽JSX

我正在写一个项目，这是与生成。此包生成一个基于

gulp

的项目

我选择使用

react

编写应用程序，包括

JSX

文件（扩展名为

.JSX

文件）。此外，我更喜欢将ES6语法与

import\uuuuuuu\from'

语句一起使用

我正在尝试编写一个gulp任务，该任务将使用

.jsx

扩展名处理react文件，如下所示：

gulp.task('react-scripts', () => {
    return gulp.src('app/scripts/**/*.jsx')

        // run some pipes with the files

        .pipe(gulp.dest('.tmp/scripts'))
        .pipe(reload({stream: true}));
});

这个管道应该处理

ES6

语法，并包括

react

和

requirejs

的插件（因为我使用的是

import

语句）

我读到过像

gulprequirejs

和

gulpjsx

这样的软件包，但正如您所看到的，它们被列入了黑名单

---

有没有一个有效的方法来实现这一点？谢谢

我目前在React设置中使用browserify/Babelify

const browserify = require('browserify')
const source = require('vinyl-source-stream')
const buffer = require('vinyl-buffer')
const notify = require('gulp-notify')

gulp.task('js', () => {
  return browserify('src/js/main.js', { debug: true })
    .transform('babelify', {
      presets: ['react', 'es2015', 'stage-0']
    })
    .bundle().on('error', notify.onError((error) => {
      if (error) {
        console.log(error.stack)
        return 'error in JS'
      }
    }))
    .pipe(source('index.js'))
    .pipe(buffer())
    .pipe(gulp.dest(dir))
    .pipe(notify('Javascript Finished Compiling'))
})

---

我的

main.js

将包括我的所有导入和react渲染。

可能值得一看我的@KarlTaylor。我的问题是babel将导入转换为

require

语句，而浏览器无法识别它。这就是为什么我应该使用类似于

requirejs

的东西？