javascript - 使用 gulp-imgmin 多次压缩或缩小图像是否不好？

Question

我正在尝试决定是应该压缩/缩小所有图像并让它们相互覆盖，还是应该将每个图像的缩小/压缩版本存储在单独的文件夹中？

继续压缩已经压缩过的图像会不好吗？

Answer 1

为了测试 gulp-imagemin，我设置了以下 gulpfile。我已经包含了一些 additional imagemin plugins .

var gulp = require('gulp'),
imagemin = require('gulp-imagemin');

gulp.task('imagemin', function() {
    return gulp.src('src/lib/images/**.*')
           .pipe(imagemin({
                progressive: true
           }))
           .pipe(gulp.dest('src/lib/images/'))
});

gulp.task('default', ['imagemin']);

这是我的初始文件夹结构(仅包含一张图片)

src/ 
|-- lib/ 
|   |-- images/
|   |   |-- nasa.jpg

第一次运行 gulp 输出如下

[22:31:32] gulp-imagemin: Minified 1 image (saved 489 B - 2.1%)

再次运行 gulp 输出如下

[22:32:43] gulp-imagemin: Minified 1 image (saved 0 B - 0%)

---

回答您的问题

I am trying to decide if I should just compress/minify all my images and have them just overwrite each other, or if I should store the minified/compressed versions of each image in a separate folder?

根据 Charminbear 的建议，建议将您的工作区拆分为例如“src”(源)和“dist”(分发)文件夹。您可以将未压缩的图像存储在 src/lib/images 中，并使用 gulp 将缩小的图像提供给 dist/lib/images。

src/ 
|-- lib/ 
|   |-- images/  
|   |   |-- nasa.jpg
|   |   |-- mars.jpg
dist/
|-- lib/
|   |-- images/
|   |   |-- nasa.jpg
|   |   |-- mars.jpg
gulpfile.js

What is the role of src and dist folders?

Or when gulp-imgmin goes to compress the image, does it see its already compressed and skip it?

gulp-imagemin 不会尝试缩小已经缩小的图像。