用tinypng插件创建gulp task压缩图片

TinyPng 是什么

官方介绍：

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包，gulp-tinypng但是我没有用它尝试，有兴趣的朋友可以尝试一下。我用了这个插件gulp-tinypng-compress。使用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。

用tinypng插件创建gulp task压缩图片相关推荐

js常用插件(七)之conversion压缩图片(不改变图片尺寸大小)
js常用插件之conversion压缩图片(重点:不改变尺寸大小) 欢迎点击: 个人官网博客图片压缩只是他的一种功能,更多可以查看官方文档重点:压缩体积并且图片尺寸大小是不变的用法很简单: &l ...
使用TinyPNG API压缩图片
使用TinyPNG API压缩图片在撰写论文的时候,美观,大气,上档次的图标能够很好地给自己的论文加分,好的可视化结果也能够让审稿人赏心悦目.但是有时候在可视化图片的时候有可能原始图像过大从而很占内 ...
gulp教程之gulp-imagemin（gulp-imagemin压缩图片文件）
原文:http://www.ydcss.com/archives/26 简介: 使用gulp-imagemin压缩图片文件(包括PNG.JPEG.GIF和SVG图片),很多人安装gulp-imagem ...
gulp教程之gulp-imagemin压缩图片
简介: 使用gulp-imagemin压缩图片文件(包括PNG.JPEG.GIF和SVG图片),很多人安装gulp-imagemin都会出现错误,我也查了很多资料,也不知道所以然,我的做法是出错再重新 ...
续Gulp使用入门三步压缩图片
gulp 压缩图片压缩图片文件可降低文件大小,提高图片加载速度. 找到规律转换为 gulp 代码规律找到 images/ 目录下的所有文件,压缩它们,将压缩后的文件存放在 dist/image ...
node 压缩图片_手搓一个TinyPng压缩图片的WebpackPlugin
作者: JowayYoung 转发链接:https://mp.weixin.qq.com/s/eqsZwZPCX-GZyB-EOm3TwQ 前言曾经发表过一篇性能优化的文章<「实践」细聊前端性 ...
node 压缩图片_嗯，手搓一个TinyPng压缩图片的WebpackPlugin也SoEasy啦
作者:JowayYoung 仓库:Github.CodePen 博客:掘金.思否.知乎.简书.头条.CSDN 公众号:IQ前端联系我:关注公众号后有我的微信哟特别声明:原创不易,未经授权不得对此文 ...
java 多线程压缩_Java 多线程拷贝文件夹并调用tinyPng算法接口压缩图片实现（生产消费变种）...
线程模型生产者Provider线程为一,主要进行深搜目录文件:. 消费者Consumer线程多个, 因为RPC服务调用时延较长, 启用多个线程请求服务. 持久化线程Persist 将已经消费的消息存 ...
Android apk瘦身之使用TinyPng压缩图片
1 前言 Android apk太大了怎么办,有的时候需要减小apk的体积,例如上传到服务器的时候有文件大小的限制.百度一下,发现大致有以下几种方法: 使用混淆,减少代码体积删除不使用的资源减少使 ...

用tinypng插件创建gulp task压缩图片

TinyPng 是什么

创建gulp task

用tinypng插件创建gulp task压缩图片相关推荐

最新文章

热门文章