0.0.5 • Published 5 years ago
img-master v0.0.5
Img Master
img-master是一个多功能无限制的图像批处理工具，提供压缩、分组、标记和变换四大批处理功能
安装
npm i -g img-master
安装失败
img-master某些功能基于sharp，所以在安装过程中可能会失败或报错，请通过以下步骤解围。
- 切换NPM镜像为淘宝镜像：
npm config set registry https://registry.npm.taobao.org/ - 切换NPM模块内置Node镜像为淘宝镜像：
npm config set disturl https://npm.taobao.org/mirrors/node/ - 切换Sharp镜像为淘宝镜像
-
npm config set sharp_binary_host https://npm.taobao.org/mirrors/sharp/-npm config set sharp_libvips_binary_host https://npm.taobao.org/mirrors/sharp-libvips/ - 强制清理缓存：
npm cache clean -f(曾经安装失败才执行) - 重新执行安装命令：
npm i -g img-master
若是多账户电脑(公司环境)，请切换到管理员账号下执行npm i -g img-master重新安装若有兴趣了解某些模块因NPM镜像问题而安装不上的解围思路，可查看笔者这篇《聊聊NPM镜像那些险象环生的坑》，相信会对你有很大的帮助。
使用
| 命令 | 缩写 | 功能 | 描述 |
|---|---|---|---|
img-master compress | img-master c | 压缩图像 | 基于TinyJPG或TinyPNG进行压缩 |
img-master group | img-master g | 分组图像 | 按照图像尺寸、类型或体积进行分组 |
img-master mark | img-master m | 标记图像 | 基于Sharp进行标记，提供交互式问答调用 |
img-master transform | img-master t | 变换图像 | 基于Sharp进行变换，提供多配置链式调用 |
- 推荐使用缩写命令
- 目前只能处理
JPG和PNG的图像 - 可遍历根目录下所有多层文件夹里符合条件的图像文件
- 进入需要处理图像的根目录：
cd my-image，再根据需求执行以上命令
图像压缩
- 使用
https://tinyjpg.com或https://tinypng.com压缩图像会有20张的数量限制 img-master c基于以上两个网站进行压缩，但是通过随机修改请求头的X-Forwarded-For绕过其数量限制
图像变换
- 特点：执行命令可追加多个配置，支持链式调用，变换情况依据配置的顺序而有所不同
- 链式调用：当前配置处理完的图像，以流的方式传入下一个配置进行处理，直至结束，
类似Gulp的流处理 - 调用结果：不同配置组合的生成图像可能不同，即使相同配置但不同顺序也可能导致生成图像不同
| 配置 | 功能 | 格式([]表示可选) | 描述 |
|---|---|---|---|
--blur | 模糊 | 0.3~1000 | 不设置则不生效 |
--extract | 裁剪 | left,top,width,height | 不设置则不生效 |
--flip | 平翻 | true | 不设置则不生效 |
--flop | 对翻 | true | 不设置则不生效 |
--format | 格式 | jpg或png | 不设置则使用图像原来的类型 |
--grayscale | 灰度 | true | 不设置则不生效 |
--negate | 负片 | true | 不设置则不生效 |
--normalise | 对比 | true | 不设置则不生效 |
--resize | 尺寸 | width,height[,fit] | 若其中一方为0则自动缩放以匹配另一方不设置则不生效 |
--rotate | 旋转 | angle[,bgcolor] | 不设置则不生效 |
--sharpen | 锐化 | true或[sigama,flat,jagged] | true表示执行快速温和的锐化输出sigama在0.3~1000间，其余参数必须>0不设置则不生效 |
- fit：填充
-
cover：裁剪以适应在指定尺寸中 -contain：嵌入在指定尺寸中 -fill：忽略宽高比，拉伸以填满在指定尺寸中 -inside：保留宽高比，将尺寸调整到尽可能大，同时确保其尺寸小于或等于指定尺寸 -outside：保留宽高比，将尺寸调整到尽可能小，同时确保其尺寸大于或等于指定尺寸 - bgcolor：背景色
-
transparent：透明，需配合--format png使用 -HEX：16进制色值，可选#xyz或#uvwxyz-RGB：RGB色值，rgba(r,g,b)-RGBA：RGBA色值：rgba(r,g,b,a)
注意事项
- 配置一定要完整输入且正确，格式为
--opt [val]，不然会报错导致无法执行 - 配置参数间相连只能使用英文逗号
,，不能使用空格 - 配置详情请参考sharp-api
细节
压缩图像
- 输出目录为
#compressed-dist# - 图像可任意放置到根目录多层文件夹下，压缩图像后原样输出图像位置到
#compressed-dist#下 - 重新压缩图像时，先移除
#compressed-dist#再生成新的#compressed-dist#，注意保存压缩过的图像
分组图像
- 输出目录为
#grouped-dist# - 图像可任意放置到根目录多层文件夹下，分组图像后按照分组依据输出图像位置到
#grouped-dist#下 - 重新分组图像时，先移除
#grouped-dist#再生成新的#grouped-dist#，注意保存分组过的图像
标记图像
- 输出目录为
#marked-dist# - 图像可任意放置到根目录多层文件夹下，标记图像后原样输出图像位置到
#marked-dist#下 - 重新标记图像时，先移除
#marked-dist#再生成新的#marked-dist#，注意保存标记过的图像
变换图像
- 输出目录为
#transformed-dist# - 图像可任意放置到根目录多层文件夹下，变换图像后原样输出图像位置到
#transformed-dist#下 - 重新变换图像时，先移除
#transformed-dist#再生成新的#transformed-dist#，注意保存变换过的图像
示例
所有命令作用一次以下文件夹的图像
压缩图像
img-master c
分组图像
img-master g
标记图像
img-master m
变换图像
img-master t --resize 300,0 --extract 50,50,100,100 --rotate 200,#3c9 --blur 5 --format png
相同配置但不同顺序也可能导致生成图像不同版权
MIT © Joway Young
后记
若觉得img-master对你有帮助，可在Issue上提出你的宝贵建议，笔者会认真阅读并整合你的建议。喜欢img-master的请给一个Star，或Fork本项目到自己的Github上，根据自身需求定制功能。
关注公众号IQ前端，一个专注于CSS/JS开发技巧的前端公众号，更多前端小干货等着你喔
