使用 Gulp 输出缩小版本和非缩小版本

Question

我在 Gulpfile.js 中有这个捆绑器，它运行良好：

var compile = (watch) => {
  var bundler = watchify(browserify('./src/index.js', { debug: true }).transform(babel));

  var rebundle = () => {
    bundler.bundle()
      .on('error', function(err) { console.error(err); this.emit('end'); })
      .pipe(source('lib.js'))
      .pipe(buffer())
      .pipe(sourcemaps.init({ loadMaps: true }))
      .pipe(sourcemaps.write('./'))
      .pipe(gulp.dest('./dist/'));
  };

  if (watch) {
    bundler.on('update', function() {
      console.log('-> bundling...');
      rebundle();
    });
  }

  rebundle();
};

这给了我：arli.js 和 arli.js.map

但是当试图像这样丑化它时：

var compile = (watch) => {
  var bundler = watchify(browserify('./src/index.js', { debug: true }).transform(babel));

  var rebundle = () => {
    bundler.bundle()
      .on('error', function(err) { console.error(err); this.emit('end'); })
      .pipe(source(lib.js))
      .pipe(buffer())
      .pipe(sourcemaps.init({ loadMaps: true }))
      .pipe(sourcemaps.write('./'))
      .pipe(gulp.dest('./dist/'));

    return gulp.src('./dist/lib.js')
      .pipe(rename('lib.min.js'))
      .pipe(sourcemaps.init())
      .pipe(uglify({
        preserveComments: 'license',
      }))
      .pipe(sourcemaps.write('./'))
      .pipe(gulp.dest('./dist/'));
  };

  if (watch) {
    bundler.on('update', function() {
      console.log('-> bundling...');
      rebundle();
    });
  }

  rebundle();
};

这给了我相同的两个文件，但如果我重复这个任务，它也会给我 lib.min.js 和 lib.min.js.map，因为第一次 lib.js 是不存在。

我试过运行-sequence 但它也是一样的。

Answer 1

您可以尝试使用 end 回调吗？

var compile = (watch, done) => {
  var bundler = watchify(browserify('./src/index.js', { debug: true }).transform(babel));

  var rebundle = () => {
    bundler.bundle()
      .on('error', function(err) { console.error(err); this.emit('end'); })
      .pipe(source(lib.js))
      .pipe(buffer())
      .pipe(sourcemaps.init({ loadMaps: true }))
      .pipe(sourcemaps.write('./'))
      .pipe(gulp.dest('./dist/')).on('end', function () {
        gulp.src('./dist/lib.js')
          .pipe(rename('lib.min.js'))
          .pipe(sourcemaps.init())
          .pipe(uglify({
            preserveComments: 'license',
          }))
          .pipe(sourcemaps.write('./'))
          .pipe(gulp.dest('./dist/')).on('end', function() {
            done();
          });
      });
  };

  if (watch) {
    bundler.on('update', function() {
      console.log('-> bundling...');
      rebundle();
    });
  }

  rebundle();
};

使用 Gulp 输出缩小版本和非缩小版本

Output a minified version and non minified version with Gulp

javascript

node.js

gulp

browserify

babeljs