简介：
使用gulp-imagemin压缩图片文件（包括PNG、JPEG、GIF和SVG图片）
1、安装nodejs/全局安装gulp/本地安装gulp/创建package.json和gulpfile.js文件
1.1、gulp基本使用还未掌握？请参看： gulp详细入门教程
1.2、本示例目录结构如下：
2、本地安装gulp-imagemin
2.1、github：https://github.com/sindresorhus/gulp-imagemin
2.2、安装：命令提示符执行 cnpm install gulp-imagemin --save-dev
2.3、注意：没有安装cnpm请使用 npm install gulp-imagemin --save-dev什么是cnpm，如何安装？
2.4、说明：--save-dev 保存配置信息至 package.json 的 devDependencies 节点。为什么要保存至package.json？
3、配置gulpfile.js
3.1、基本使用
|
1
2
3
4
5
6
7
8
|
,
;
{
)
)
;
;
|
3.2、gulp-imagemin其他参数 具体参看
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
,
;
{
)
{
//类型：Number 默认：3 取值范围：0-7（优化等级）
//类型：Boolean 默认：false 无损压缩jpg图片
//类型：Boolean 默认：false 隔行扫描gif进行渲染
//类型：Boolean 默认：false 多次优化svg直到完全优化
)
;
;
|
3.3、深度压缩图片
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
|
,
,
//确保本地已安装imagemin-pngquant [cnpm install imagemin-pngquant --save-dev]
;
{
)
{
,
//不要移除svg的viewbox属性
//使用pngquant深度压缩png图片的imagemin插件
)
;
;
|
3.3、只压缩修改的图片。压缩图片时比较耗时，在很多情况下我们只修改了某些图片，没有必要压缩所有图片，使用”gulp-cache”只压缩修改的图片，没有修改的图片直接从缓存文件读取（C:UsersAdministratorAppDataLocalTempgulp-cache）。
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
|
,
,
,
//确保本地已安装gulp-cache [cnpm install gulp-cache --save-dev]
;
{
)
{
,
,
]
)
;
;
|
4、执行任务
4.1、命令提示符执行：gulp testImagemin
5、结束语
5.1、本文有任何错误，或有任何疑问，欢迎留言说明。
来源：http://www.ydcss.com/archives/26