使用 Gulp 跳过已压缩文件的丑化

Skip uglifying already compressed files with Gulp

我有一种情况,我目前正在丑化所有 JavaScript 文件,即使它们已经被压缩,这显然不是一个好主意。

我各自的任务是:

gulp.task('uglify', ['scripts'], function() {
    return gulp.src('./js/scripts.js')
        .pipe(rename({suffix: '.min'}))
        .pipe(uglify({
            mangle: false
        }))
        .pipe(gulp.dest('./js'));
});

scripts.js 是之前拼接在一起的文件,但很明显,如果里面有一些已经压缩的文件,那么它们会再次变丑,我们正在努力避免这种情况。

所以我四处搜索并一直在考虑再次处理所有文件,而不是处理未缩小的(只包含串联文件的文件)版本,这样我可以更好地控制每个文件。

我研究过使用 gulp-ignoregulp-if,而 gulp-if 似乎可能是我想要的;但是我不是 100% 确定流在 Gulp 中是如何运行的——当你向它传递一个文件列表时,它是循环遍历每个文件的任务还是只循环 运行 一次?

我很好奇,因为如果它 运行 对我正在处理的每个文件都进行了这样的操作:

gulp.task('uglify', ['scripts'], function() {
    return gulp.src(js_scripts)
        .pipe(gulpif(condition, uglify({mangle: false})))
        .pipe(concat('scripts.min.js'))
        .pipe(gulp.dest('./js'));
});

其中 condition 是检查文件名中是否有 .min 的东西,如果有,请不要对其进行丑化。

所以我的问题是 - 如果它循环通过并且我可以 运行 每个文件的条件,我该如何对文件名进行 运行ning 测试,如果它不循环到那时我怎样才能实现我在这里想要做的事情?我是否将被迫创建两个单独的任务,一个用于未缩小的任务,一个用于 .min 文件,然后在最后将它们连接在一起?

我认为你的例子应该这样做,uglify只有满足 condition,但不管条件如何,都将所有文件传递给下一个操作员。

gulp.task('uglify', ['scripts'], function() {
    return gulp.src(js_scripts)
        .pipe(gulpif(condition, uglify({mangle: false})))
        .pipe(concat('scripts.min.js'))
        .pipe(gulp.dest('./js'));
});

gulp-if 页面上有一个名为 1: Conditionally filter content 的示例,其中指出:

Only uglify the content if the condition is true, but send all the files to the dist folder

我认为即使在 dist 文件夹之前有内容,它也会将所有文件发送到流中。

至于循环问题,条件是在源文件中检查每个文件,js_scripts 这里。

编辑: 你可以使用条件函数来检查文件名

var condition = function (file) {
  // TODO: add business logic
  console.log(file.path);
  return true;
}

编辑 2

根据@mark 和@Brett 的评论和研究,您还可以使用 Regex 排除已经缩小的文件,即带有 .min.js 后缀的文件:

gulp.task('uglify', ['scripts'], function() {
    return gulp.src(js_scripts)
        .pipe(gulpif('!**/*.min.js', uglify({mangle: false})))
        .pipe(concat('scripts.min.js'))
        .pipe(gulp.dest('./js'));
});

在@lofihelsinki and @mark's 的帮助下,我想出了一个解决方案。

虽然这些引导我朝着正确的方向前进,但我仍然不得不通过反复试验来调整一些代码,所以我无法接受答案,但我想感谢他们,因为他们引导我找到了解决方案。

最终解决方案是:

gulp.task('uglify', ['scripts'], function() {
    return gulp.src(js_scripts)
        .pipe(gulpif('!**/*.min.js', uglify({mangle: false})))
        .pipe(concat('scripts.min.js'))
        .pipe(gulp.dest('./js'));
});

我尝试了@Mark 的建议,但似乎即使您在流中有文件,您仍然必须遵守文件夹位置;所以我不得不将他的建议 '!*.min.js' 更改为 '!**/*.min.js';这现在只会对文件名中 包含 .min.js 的脚本进行 uglify,而 包含 的脚本将原封不动地通过。