Question

我正在尝试自动化连接和uglify js in gulp。

这是我的gulpfile.js：

gulp.task('compressjs', function() {
    gulp.src(['public/app/**/*.js','!public/app/**/*.min.js'])
    .pipe(sourcemaps.init())
    .pipe(wrap('(function(){"use strict"; <%= contents %>\n})();'))
    .pipe(uglify())
    .pipe(concat('all.js'))
    .pipe(rename({
        extname: '.min.js'
    }))
    .pipe(sourcemaps.write('.'))
    .pipe(gulp.dest('public/app'));
})

您是否认为需要使用(function(){"use strict"; <%= contents %>\n})();包装每个文件以避免在每个文件加入时发生冲突？你认为我的gulp任务是好的，还是可以更好地执行它的任务？

Answer 1

大多数代码都不需要包含闭包中的每个文件。有一些坏的库存泄漏变量，但我建议您根据具体情况处理它们，如果可能的话，发出Pull Requests来解决问题或者只是停止使用它们。通常它们不能像在函数中包装它们那样修复。

您上面的任务未能将所有文件正确传递给uglify任务 - 您需要先进行连接。您也不需要重命名，因为您可以在concat中指定全名。以下是经过充分测试的Gulp设置，可以完全满足您的要求：

gulp.task('javascript:vendor', function(callback) {
  return gulp.src([
      './node_modules/jquery/dist/jquery.js',
      './node_modules/underscore/underscore.js',
      './node_modules/backbone/backbone.js'
    ])
    .pipe(sourcemaps.init())
    // getBundleName creates a cache busting name
    .pipe(concat(getBundleName('vendor')))
    .pipe(uglify())
    .pipe(sourcemaps.write('./'))
    .pipe(gulp.dest('./public/app'))
    .on('error', handleErrors);
});

在gulp中连接和uglify js的最佳方法

1 个答案: