gulp图片压缩

网页性能优化,通常要处理图片,尤其图片量大的时候,更需要工具来批量处理,这里使用gulp,做个简单总结

image-resize压缩尺寸

 var gulp = require('gulp');
var imageResize = require('gulp-image-resize');
gulp.task('resize', function() {
return gulp.src('./images/**/*')
.pipe(imageResize({
width: 400
}))
.pipe(gulp.dest('dist/resize'));
});

gulp-imagemin品质压缩

 var gulp = require('gulp');
var imagemin = require('gulp-imagemin');
var pngquant = require('imagemin-pngquant');
gulp.task('min', function() {
return gulp.src('./images/**/*')
.pipe(imagemin({
progressive: true,
use: [pngquant({
quality: '65-80'
})]
}))
.pipe(gulp.dest('dist/min'));
})

gulp图片压缩的更多相关文章

  1. gulp之压缩图片

    //先全局安装gulp:npm install -g gulp //然后在项目根目录中安装gulp依赖:npm install --save-dev gulp //http://www.gulpjs. ...

  2. 前端构建工具之gulp(一)「图片压缩」

    前端构建工具之gulp(一)「图片压缩」 已经很久没有写过博客了,现下终于事情少了,开始写博吧 今天网站要做一些优化:图片压缩,资源合并等 以前一直使用百度的FIS工具,但是FIS还没有提供图片压缩的 ...

  3. gulp-imagemin图片压缩----gulp系列(三)

    本节实现图片压缩,在实现压缩前,先配置images任务,设置源目录和输出目录. 在系列(二)代码的基础上,再进行扩展. 1.找到gulp->config.js,对images进行源目录(src- ...

  4. Gulp自动化工具之图片压缩

    一.安装node https://nodejs.org/download/ 根据需要选择对应的版本 安装好了之后可以通过node -v参看一下版本 node -v 二.安装gulp npm insta ...

  5. Gulp 之图片压缩合并

    同事需要处理很多的图片,由于UI那边提供图片比较大,为了性能好一点,程序包小一点,因此希望我帮忙做成小程序来完成此工作. 其实之前做过一个grunt写的图片压缩合并工具,当时是为了处理270多个国家/ ...

  6. 玩转gulp之压缩打包热重载

    上节上上节我们讲了gulp的sass编译和watch监听,动态加载 这样我们就可以做到,我管我写我的sass然后保存,自动编译,就好像我们在写css一样,这是一个自动化的一大步.我们呱唧呱唧. 我们已 ...

  7. Golang 编写的图片压缩程序,质量、尺寸压缩,批量、单张压缩

    目录: 前序 效果图 简介 全部代码 前序: 接触 golang 不久,一直是边学边做,边总结,深深感到这门语言的魅力,等下要跟大家分享是最近项目 服务端 用到的图片压缩程序,我单独分离了出来,做成了 ...

  8. 三款不错的图片压缩上传插件(webuploader+localResizeIMG4+LUploader)

    涉及到网页图片的交互,少不了图片的压缩上传,相关的插件有很多,相信大家都有用过,这里我就推荐三款,至于好处就仁者见仁喽: 1.名气最高的WebUploader,由Baidu FEX 团队开发,以H5为 ...

  9. Android 图片压缩、照片选择、裁剪,上传、一整套图片解决方案

    1.Android一整套图片解决方案 http://mp.weixin.qq.com/s?__biz=MzAxMTI4MTkwNQ==&mid=2650820998&idx=1& ...

随机推荐

  1. Webform:Application、ViewState对象的用法

    Application Application对象的作用范围是整个全局,也就是说对所有用户都有效.它在整个应用程序生命周期中都是有效的,类似于使用全局变量一样,所以可以在不同页面中对它进行存取.它和S ...

  2. ubuntu-Linux系统读取USB摄像头数据(uvc)

    这几天在做小车的过程中,需要用到图像采集.我想现在用的摄像头是UVC免驱的.根据国嵌的教程中有一个gspca摄像头的程序.我发现把gspca的采集程序用到uvc上时,在显示图像的时候提示没有huffm ...

  3. 解读ASP.NET 5 & MVC6系列(11):Routing路由

    新版Routing功能介绍 在ASP.NET 5和MVC6中,Routing功能被全部重写了,虽然用法有些类似,但和之前的Routing原理完全不太一样了,该Routing框架不仅可以支持MVC和We ...

  4. [LeetCode] Elimination Game 淘汰游戏

    There is a list of sorted integers from 1 to n. Starting from left to right, remove the first number ...

  5. mtk flash tool,Win7 On VirtualBox

    SP_Flash_Tool_exe_Windows_v5.1624.00.000 Win7 在 VirtualBox, 安裝 mtk flash tool, v5.1628 在燒錄時會 fail. v ...

  6. IOS比较常用的第三方组件及应用源代码(持续更新中)

    把平时看到或项目用到的一些插件进行整理,文章后面分享一些不错的实例,若你有其它的插件欢迎分享,不断的进行更新~ 一:第三方插件 1:基于响应式编程思想的oc 地址:https://github.com ...

  7. cmd常用命令

    2016.12.18 0:07 (持续更新) cd 目录名:打开文件目录, cd .. 返回上一目录 cd ... 返回上上级目录 cd \ 返回根目录 cls 清除当前cmd页面所有的记录 md 名 ...

  8. jquery-读取form表单中的所有数据列表

    代码: <script> $(function() { $('#submit').click(function() { var d = {}; var t = $('form').seri ...

  9. java面向对象---对象初始化

    在本地变量中,如果定义了一个变量后没有赋值就使用,那么eclipse就会报错:但是在成员变量中,java是会强制给一个没有初始化的变量一个默认的初始值0, 如果是一个boolean类型的变量,那么默认 ...

  10. UVA1225

    每增加1个整数,所有位上的对应数都加一.建立一个10000列10行的表,然后查表就可以了. #include<stdio.h> #include<string.h> ][]; ...