在gulp中使用Traceur + browserify + uglyify

Question

我希望有一个gulpfile能够先将我的ES6代码转换为ES5并保存到一个目录，然后在每个文件上进行browserify并保存到另一个目录，最后我想将其压缩并作为.min.js文件放入browserified文件夹中。下面是结果的示意图：

src/
  es6/
    index.js
    mod.js
  es5/
    index.js
    mod.js
  es5-browser/
    index.js
    index.min.js
    mod.js
    mod.min.js

这是我的 gulpfile 文件，但是我一直收到一个找不到模块的错误：

var gulp = require('gulp');
var traceur = require('gulp-traceur');
var browserify = require('gulp-browserify');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('es5ize', function () {
  return gulp.src('src/es6/**/*.js')
    .pipe(sourcemaps.init())
    .pipe(traceur({sourceMaps: true}))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest('src/es5'))
    .pipe(browserify({
      debug : true
    }))
    .pipe(gulp.dest('src/es5-browser'))
    ;
});

我知道不应该使用gulp-browserify，但我无法使用vinyl也得不到类似的结果。

直到browserify 步骤，所有步骤都有效。

如何让这个工作？

编辑:

我希望能够在gulp中保留此功能，而不必执行任何操作，因为最终我也想在watchify上使用它。

所有其他与此类似的示例都需要browserify创建一个捆绑包，然后操作该捆绑包，但这意味着它将始终以browserifed开头，这是我不想要的。他们还似乎需要为browserify指定一个入口文件，但我想指定一个glob并转换匹配的所有文件。

- qwertymk

---

你能给我们提供当前gulpfile的错误输出吗？ - EthanB

Browserify 需要入口点来启动。从这些入口点开始，它将构建一个依赖图，并仅打包您实际需要的模块。简而言之，您不应该将所有 js 文件都传输到 browserify 中。 - Ben

Answer 1

您需要使用Traceur来编译成CommonJS模块，以便Browserify能够理解 .pipe(traceur({modules: 'commonjs' }))

- user3995789