yorke19900505 / image-compress

基于Gulp编写的图片压缩工具,欢迎star

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

基于Gulp编写的图片、JS、CSS压缩工具包含图片裁剪、合并功能

图片裁剪、合并功能使用的是images插件实现
插件地址:https://www.npmjs.com/package/images
执行图片压缩之前先执行图片合并
    1. app.js文件中写了一些注释
    1. 目录结构增加调整
    1. node app.js
图片压缩主要有3中方法
  • 1、使用 gulp-imagemin 插件进行压缩,效果比较差,图片压缩后大小变化不是很大;
  • 2、使用 gulp-tinypng-nokey 插件进行压缩,效果一般,图片压缩后的比例一般;
  • 3、使用 gulp-tinypng-compress 插件进行压缩,花钱的就是不一样,压缩后的效果很好,需要申请KEY,每个月免费压缩500张。

去tinypng官网申请key:https://tinypng.com/developers

环境说明
  • node >= 8.0.0
  • gulp >= 4.0.0
使用
  • 1、安装依赖
 yarn install / npm install
  • 2、启动
gulp script  // 压缩js
gulp css     // 压缩css
gulp image   // 第一种压缩图片方法
gulp tp      // 第二种压缩图片方法
gulp tinypng // 第三种压缩图片方法
gulp upload  // 上传图片到腾讯云
gulp del     // 删除dist文件夹下的所有文件

#! 打算把这些命令集合在一起,正在研究~~~~
  • 3、文件存放
1、图片存放在根目录的images目录下,执行完命令后会在根目录生成dist文件夹images文件夹生成压缩后的图片

2、js文件存放在根目录的js目录下,执行完命令后会在根目录生成dist文件夹js文件夹生成压缩后的js文件

3、css文件存放在根目录的css目录下,执行完命令后会在根目录生成dist文件夹css文件夹生成压缩后的css文件

About

基于Gulp编写的图片压缩工具,欢迎star


Languages

Language:JavaScript 100.0%