0

我尝试使用带有 gulp、browserify、reactify 的 transform-es2015-classes 插件。

var gulp = require('gulp');
var browserify  = require('browserify');
var babelify    = require('babelify');
var source      = require('vinyl-source-stream');
var buffer      = require('vinyl-buffer');
var uglify      = require('gulp-uglify');
var sourcemaps  = require('gulp-sourcemaps');
var livereload  = require('gulp-livereload');
var reactify = require('reactify');
var util = require('gulp-util');


gulp.task("reactcompile", function () {
    // app.js is your main JS file with all your module inclusions
    return browserify({entries: './src/main/app/reactjs/react-app.js', debug: true})
        .transform("babelify", 
        {
          plugins: [
            'transform-es2015-classes', { loose: true }
          ],
            presets: ["es2015", "react", "stage-0"] 
        })
        .bundle()
        .on('error', util.log.bind(util, 'Browserify Error'))
        .pipe(source('react-app.js'))
        .pipe(buffer())
        .pipe(gulp.dest('./build'))
        .pipe(livereload());
});

当我运行 gulp 时,我得到了错误:

[12:06:45] Browserify 错误 { 错误:“base”中指定的插件 1 在解析文件时提供了“loose”的无效属性:mypath\react-app.js

我的语法错误还是有什么问题?

4

1 回答 1

2

您缺少一组[]s。

plugins: [
  'transform-es2015-classes', { loose: true }
]

应该

plugins: [
  ['transform-es2015-classes', { loose: true }]
]

因此插件及其参数是plugins数组中的单个项目。

于 2018-01-16T17:21:00.770 回答