博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
用tinypng插件创建gulp task压缩图片
阅读量:6573 次
发布时间:2019-06-24

本文共 900 字,大约阅读时间需要 3 分钟。

是什么

官方介绍:

Smart PNG and JPEG compression

Optimize your images with a perfect balance in quality and file size.

用户体验: 它能帮我很好的压缩png,jpeg,大的压缩率并且能保证图片质量,肉眼看不出图片的变化。

此外它支持做为 photoshop插件,提供php, nodejs等api 具体内容,请看

创建gulp task

我想建一个gulp任务来帮我压缩项目图片,不需要一张张上传到官方网站再下载。(不能想象,这种蠢笨的事情我干过)

官方提供了一个node包,但是我没有用它尝试,有兴趣的朋友可以尝试一下。我用了这个插件。使用tinypng需要到官方注册你的邮件,拿到你的key,并且有限制每月免费500张,后续会收费。并且在执行task的时候,最好有vpn不然会很慢。

// 图片压缩    var gulp = require('gulp');    var tinypng = require('gulp-tinypng-compress');        gulp.task("tinypng", function(){        gulp.src('img/**/*.{png,jpg,jpeg}')            .pipe(tinypng({                key: '-HERE IS YOUR API KEY-',                sigFile: 'images/.tinypng-sigs',                log: true            })).on('error', function(err) {                console.error(err.message);            })            .pipe(gulp.dest('dis/img'));    });

我个人实践后的效果很明显,原先所有图片有43.6MB,压缩后只有15.5MB。

转载地址:http://eggjo.baihongyu.com/

你可能感兴趣的文章
169. Majority Element
查看>>
下拉菜单
查看>>
[清华集训2014]玛里苟斯
查看>>
Doctype作用?严格模式与混杂模式如何区分?它们有何意义
查看>>
【MVC+EasyUI实例】对数据网格的增删改查(上)
查看>>
第三章:如何建模服务
查看>>
Project Euler 345: Matrix Sum
查看>>
你可能不知道的技术细节:存储过程参数传递的影响
查看>>
POJ1703 Find them, Catch them
查看>>
HTML转义字符大全(转)
查看>>
[摘录]调动员工积极性的七个关键
查看>>
Linux getcwd()的实现【转】
查看>>
Backup Volume 操作 - 每天5分钟玩转 OpenStack(59)
查看>>
.htaccess 基础教程(四)Apache RewriteCond 规则参数
查看>>
转: maven进阶:一个多模块项目
查看>>
Android控件之HorizontalScrollView 去掉滚动条
查看>>
UVM中的class--2
查看>>
任务调度器配置文件
查看>>
ORACLE 存储过程异常捕获并抛出
查看>>
HDU 4293 Groups (线性dp)
查看>>