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. EEG preprocessing - A Trick Before Doing ICA

    EEGLab maillist My ICs don't have high power in low frequency is b/c I do a small trick here. before ...

  2. [LeetCode] Matchsticks to Square 火柴棍组成正方形

    Remember the story of Little Match Girl? By now, you know exactly what matchsticks the little match ...

  3. 【ios开发】UITableViewCell的重用

    移动开发需要解决的一个问题就是资源稀缺的问题.多数情况下是内存问题. 虽然现在的手机都号称大内存,高配置.但是移动app所占用的资源也在跟着不断膨胀, 也是造成内存不足的主要原因. 在前面的例子中,还 ...

  4. Lintcode答案&笔记

    1.A+B问题 给出两个整数a和b, 求他们的和, 但不能使用 + 等数学运算符 思路:作异或得到未进位和,作与并向左移1位得到进位,随后再重复操作俩结果,直到进位为0,适合用递归 public in ...

  5. C语言猜数字游戏

    猜数字游戏,各式各样的实现方式,我这边提供一个实现方式,希望可以帮到新手. 老程序猿就不要看了,黑呵呵 源代码1 include stdio.h include stdlib.h include ti ...

  6. Android组件化和插件化开发

    http://www.cnblogs.com/android-blogs/p/5703355.html 什么是组件化和插件化? 组件化开发就是将一个app分成多个模块,每个模块都是一个组件(Modul ...

  7. 封装一个函数获取匹配特定的css选择符

    function $$(selector,context){ context=context||document; var elements=context.querySelectorAll(sele ...

  8. iOS PhotoKit框架如何获取视频文件大小

    // 获取相册中的资源[group enumerateAssetsWithOptions:NSEnumerationReverse usingBlock:^(ALAsset *result, NSUI ...

  9. Linux服务器配置多台虚拟主机

    2016年11月4日15:59:12 LAMP环境 参考:http://blog.itblood.com/nginx-same-ip-multi-domain-configuration.html 在 ...

  10. 个人对B/S项目的一些理解(三)--Servlet与Strust

    以下是我自工作以来,结合对C/S项目的认知,对B/S项目的一些理解. 如有不足或者错误,请各位指正.   由于个人一开始入门时是ASP.NET MVC,是一个比较完善.完整的框架,下面仅对JAVA的w ...