如何使用 Gulp 和 Babel 将 .jsx 转换为 .js? [英] How convert .jsx to .js with Gulp and Babel?

问题描述

我需要将所有/src/.jsx 文件转换为/src/.js

I need to convert all /src/.jsx files to /src/.js

在我使用 gulp-react 之前:

Before I used gulp-react:

var react = require('gulp-react');

gulp.task('jsx', function () {
  return gulp.src('src/jsx/*.jsx')
   .pipe(react())
   .pipe(gulp.dest('src/js/'));
});

它有效，但并非没有一些小错误.当我使用 Babel 网站 (https://babeljs.io/repl/) 时，所有转换都是正确的.你可以帮帮我吗.如何设置 gulp 来转换 .JSX 文件?

It works but not without some small mistakes. When I use Babel website (https://babeljs.io/repl/) all converts right. Could you help me. How can I set gulp to convert .JSX files?

推荐答案

首先需要安装这两个包:

First you need to install these two packages:

npm install gulp-babel babel-plugin-transform-react-jsx

然后你可以这样转换:

var gulp = require('gulp');
var babel = require('gulp-babel');

gulp.task("babel", function(){
    return gulp.src("src/jsx/*.jsx").
        pipe(babel({
            plugins: ['transform-react-jsx']
        })).
        pipe(gulp.dest("src/js/"));
});

这篇关于如何使用 Gulp 和 Babel 将 .jsx 转换为 .js?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！