前言
在前端开发过程中，图片的大小通常会对网页性能产生很大的影响。因此，压缩图片成为前端优化中不可或缺的一个步骤。而gulp-tinypng-compress-wrapper这个npm包，能够将我们的这个步骤变得更加方便快捷。
简介
gulp-tinypng-compress-wrapper是一个包装了Tinify API的gulp插件，通过使用gulp-tinypng-compress-wrapper，我们可以轻松地将图片进行压缩。
安装
在使用gulp-tinypng-compress-wrapper之前，我们需要先在自己的项目中安装它。在终端中输入以下命令即可安装：
npm install gulp-tinypng-compress-wrapper --save-dev
使用
导入模块
在我们的gulpfile.js中，我们需要先导入gulp-tinypng-compress-wrapper模块。
const gulp = require('gulp');
const tinypng = require('gulp-tinypng-compress-wrapper');压缩图片
使用gulp-tinypng-compress-wrapper，我们只需要用一句代码即可实现图片压缩。
-- -------------------- ---- -------
------------------------- -- -- -
------ -----------------------------------
---------------
---- ----- --- ----- -- - ------------------- ------- ------------------
-------- -----------------------
---- ----
---
--------------------------------
--在上面的代码中，我们使用gulp.src选择了需要压缩的图片，通过.pipe()方法使用了gulp-tinypng-compress-wrapper这个插件，使用.pipe()将压缩后的图片输出到指定文件夹dist/images中。
说明
在使用gulp-tinypng-compress-wrapper的时候，我们需要传递以下三个参数。
key
这个参数是我们申请的Tinify API Key，可以在 https://tinypng.com 上申请，每月可以免费压缩500张图片。我们需要将申请到的Key填写在key参数中。
sigFile
这个参数用于记录每张图片的压缩情况，避免多次压缩同一张图片。我们也需要在gulp-tinypng-compress-wrapper制定一个.sig文件来记录这些信息。
log
这个参数是用于控制是否在终端中显示压缩信息。
总结
到这里，我们就可以使用gulp-tinypng-compress-wrapper很方便快捷的压缩图片了。如果你在前端开发中需要大量地进行图片压缩，那么使用gulp-tinypng-compress-wrapper这个npm包将可以帮助你节省很多时间和精力。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60056cd281e8991b448e6620