- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在尝试使用 imagemin Gulp 优化我的图像
https://www.npmjs.com/package/gulp-image-optimization
我很难找到可以显示确切参数和不同选项的好文档。目前我的优化并没有太多收获:
var imageop = require('gulp-image-optimization');
var pngquant = require('imagemin-pngquant');
var imageminJpegoptim = require('imagemin-jpegoptim');
var baseUrl = "web/assets/";
var imgSrc = baseUrl + "src/images/";
var imgDist = baseUrl + "dist/images/";
gulp.task('img', function(cb) {
gulp.src([imgSrc + '**/*.png', imgSrc + '**/*.jpg', imgSrc + '**/*.gif', imgSrc + '**/*.jpeg'])
.pipe(imageop({
optimizationLevel: 10,
progressive: true,
interlaced: true,
use: [pngquant(), imageminJpegoptim()]
}))
.pipe(gulp.dest(imgDist)).on('end', cb).on('error', cb);
});
我是否遗漏了配置中的某些内容?
最佳答案
我假设您有理由期待比您得到的更显着的尺寸减小。在那种情况下,我敢打赌问题出在旧技术上。
您正在使用的 gulp-image-optimization
似乎依赖于旧的 imagemin
,它没有将每种类型的优化分解为它自己的插件(我说“出现”是因为它已经有好几年了,这就是 gulp-image-optimization
文档中反射(reflect)的内容,如果我没记错的话,这就是 imagemin
过去的工作方式) .
这几天推荐的插件,链接在imagemin
中的那个。的文档是 gulp-imagemin
.
使用 gulp-imagemin
,您的基本设置类似于
const gulp = require('gulp'),
imagemin = require('gulp-imagemin');
gulp.task('default', (cb) =>
gulp.src('src/images/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/images')).on('end', cb).on('error', cb)
);
(该代码直接取自 gulp-imagemin
文档,添加了错误回调。)
关于Gulp 使用 imagemin 优化图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42255739/
我有一个 Gruntfile,例如: grunt.initConfig({ imagemin: { dynamic: { files: [ src: ['lib
我只是在尝试使用 Gulp 来简单地优化图像。我发现 imagemin-jpeg-recompress比 gulp-imagemin 附带的默认优化器更能减少 JPG .我想知道是否有办法使用 gul
npm-v6.4.1nvm——版本0.33.11 当我安装 laravel-echo 时(在 ubuntu16.04 中) npm i --save socket.io-client 我收到错误警告
这是我的 Gulp 任务: //Image Optimization gulp.task( 'imagemin', function () { return gulp.src( imageDi
环境: Windows 7 节点 6.9.5 我使用类似 this npm 的插件.但我得到一个错误。从一些视频来看,这是正确的。是相对于imagemin的版本? // gulpfile.js var
我正在使用 Grunt Imagemin 来优化图像文件夹。但是,每次我运行该命令时,它都会在所有图像上运行 imagemin。有没有办法在检测到新更改时只运行 grunt imagemin? 最佳答
一个多星期以来,我一直在寻找解决此错误的方法,但找不到任何东西。由于这个 imagemin-jpegtran,我无法在 Yeoman 上构建我的 dist 包 我尝试上传图片以显示错误并使事情变得更容
我正在尝试使用 imagemin Gulp 优化我的图像 https://www.npmjs.com/package/gulp-image-optimization 我很难找到可以显示确切参数和不同选
我试图获取以下压缩值:原始大小、缩小后的大小和节省的空间到变量中。到目前为止,我发现的只有插件仅在控制台中显示此数据。 是否有任何简单的方法可以将控制台中显示的相同数据获取到变量? 我的 gulp-i
每当我尝试让 imagemin 处理任何类型的图像时,我都会收到此错误: 21:54:49] 启动“imgmin”... [21:54:49] 'imgmin' 在 47 毫秒后出错 [21:54:4
我尝试添加如下所示的 gulp 任务并运行 gulp images 以便它仅在添加/更改的文件上运行但是,这似乎行不通......有什么想法吗? gulp.task('images', funct
我正在尝试使用 grunt 的 imagemin module 优化图像. 我的目录结构如下所示: 公共(public)图片 主要 上传 文件夹1 ... 文件夹N 在每个文件夹 1..N 中都有文件
这是我的 Gruntfile.js 中引用 iamgemin 的部分: imagemin: { options: { optimizationLevel: 3 }, build:
您好,在我的项目中,我正在使用 gulp-imagemin 将我的图像从我的 def 缩小到我的产品应用程序。这碰巧没有工作..我得到了里面没有图像的文件夹.. 这是已经完成的: gulp.task(
我的文件夹结构为 assets/images/foo/abc.jpg assets/images/bar/def.jpg .. 我想用 gulp imagemin 它们并将图像放在相同的子文件夹中,怎
我正在尝试设置 grunt-imagemin 拍摄两个不同文件夹的图像。 我有两个文件夹: 图片-用户 图片-产品。 我的想法是将 grunt-imagemin 与 grunt-watch 一起使用,
我的图像没有被优化。也许我做错了什么,但除了我的 imagemin 任务之外,其他所有任务都在为我工作。我删除了所有其他任务并尝试在下面运行我的任务,但它没有执行。 我的终端中也没有消息表明问题所在。
是否可以使用 grunt-contrib-imagemine 和 grunt-contrib-watch 查看多个文件/文件夹但只优化单个文件? 我这样试过:(gruntfile 的一部分) imag
我的 Gruntfile.js 中有以下代码片段: imagemin: { options: { optimizationLevel: 7,
我想在 Grunt.js 中测试 imagemin-contrib。我随机选择了三张jpg图片(大小分别为44kb、92kb、77kb)并设置好文件夹和插件。 当我运行 imagemin grunt
我是一名优秀的程序员,十分优秀!