@Gagatyn
Самоучка

Как транспилировать код jsx при помощи gulp?

Gulpfile.js
const gulp = require('gulp');
const babel = require('gulp-babel');

gulp.task('babel', function() {
    return gulp.src('js/source/**/*.js')
        .pipe(babel())
        .pipe(gulp.dest('js/build'))
});

package.json -> devDependencies
{
    "@babel/core": "^7.0.0-beta.53",
    "@babel/preset-env": "^7.0.0-beta.53",
    "babel-core": "^6.26.3",
    "babel-preset-env": "^1.7.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "gulp": "^3.9.1",
    "gulp-babel": "^8.0.0-beta.2",
    "gulp-browserify": "^0.5.1",
    "gulp-watch": "^5.0.0"
  }


A:\App>gulp babel
[13:24:03] Using gulpfile A:\App\gulpfile.js
[13:24:03] Starting 'babel'...

events.js:160
      throw er; // Unhandled 'error' event
      ^
Error: Plugin/Preset files are not allowed to export objects, only functions. In A:\App\node_modules\babel-preset-es2015\lib\index.js

Как транспилировать код? Ошибку выдает сверху. Подскажите пожалуйста рабочий task
  • Вопрос задан
  • 1295 просмотров
Решения вопроса 1
Установите плагин babel-plugin-transform-react-jsx, а после подключите его.
npm i -D babel-plugin-transform-react-jsx

gulp.task('babel', function() {
    return gulp.src('js/source/**/*.js')
        .pipe(babel({
            plugins: ['transform-react-jsx']
        }))
        .pipe(gulp.dest('js/build'))
});
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
@kristenstewartdadada
Frontend Developer
Поставь вебпак и не парься с настройкой
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы