前端项目开发中经常需要将UI给的图片压缩后放在项目中。市面上不乏优秀的webpack/rollup插件，一般在项目打包的时候压缩图片；也有一些终端软件，使用命令行压缩图片。
但上面的工具都达不到目前的需求：
- 自动检测项目是否添加图片；
- 添加图片后弹窗询问是否要压缩；
- 一键压缩替换图片；
- 最好用TinyPNG，开源插件配置出的压缩效果不能令所有人满意
- 最好在打包前就压缩，避免打包后效果不满意
所以auto-image-compressor出现了，一款基于Tinify（TinyPNG）压缩的VSCode插件。它满足了上面我所有的期待，而且TinyPNG的API支持每月500次的免费调用，应对日常开发绰绰有余。
接下来简单介绍一下它的用法。
1. 安装
首先在应用市场搜索auto-image-compressor找到插件安装
2. 填入API
首次安装后按照右下角的提示，首先去TinyPNG的官网注册一个账号，注册完成后在这里获取API Key：tinify.com/dashboard/a… 。
复制Key后就可以在右下角的弹窗点击Set API Key输入key。可以稍后使用ctrl/cmd+shift+p输入命令Set Tinify API Key输入Key；还可以Setting中搜索auto-image-compressor找到粘贴Key的入口。
3. 愉悦的使用吧
所有的设置就已经完成了，这时候打开项目，随便拖入一张图片，右下角就会有提示是否需要压缩。
点击Compress and Override。插件就会调用Tinify API压缩。可以看到压缩了722KB -> 139KB，81%的压缩率。Tiny还是非常值得信赖的！
现在插件还处于萌芽阶段，有很多bug和需要改进的地方。欢迎star，提issue。
