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. Spring启动后扫描解析注解的过程

    对应的类: ComponentScanBeanDefinitionParser.parse() ClassPathBeanDefinitionScanner.doScan() 参考 http://bl ...

  2. SQL操作符

    Oracle中的操作符算术操作符:无论是在sqlserver,或者是java中,每种语言它都有算术操作符,大同小异. Oracle中算术操作符(+)(-)(*)(/) 值得注意的是:/ 在oracle ...

  3. openssl、x509、crt、cer、key、csr、ssl、tls 这些都是什么鬼?

    今天尝试在mac机上搭建docker registry私有仓库时,杯具的发现最新的registry出于安全考虑,强制使用ssl认证,于是又详细了解linux/mac上openssl的使用方法,接触了一 ...

  4. 用vue.js学习es6(三):数组、对象和函数的解构

    一.数组的解构: 以前的方式: var arr = [1,2,3]; console.log(arr[0]); //1 console.log(arr[1]); //2 现在的方式: var [a,b ...

  5. PHP 扩展开发(将自己的一些代码封装成PHP扩展函数)

    今天时间不多,先给个地址,能搜到我这篇blog的朋友先看看我最近在看的一些文章.资料吧: 我的环境是 lnmp1.1 的 (LNMP一键安装包),所以要进行PHP扩展开发首先应该对环境配置和shell ...

  6. c# 判断访问来源是否来自手机

    public Boolean IsMobileDevice() { string[] mobileAgents =new []{ "iphone", "android&q ...

  7. 我的博客CSS

    这个是按照custom标准模板来做的,博客园已经有模版了,有些细节不是很好,这个是源CSS,喜欢的可以自由DIY,完善更好. @charset "utf-8"; /* CSS Do ...

  8. apache.commons.compress 压缩,解压

    最近在一个前辈的指引下,开始研究apache.commons.都是网上找的,而且不会中文乱码,而且还可以在压缩包里面加一层文件夹 package my.test; import java.io.Buf ...

  9. PHPstorm同步文件时与ftp断开连接

    一用PHPstorm同步对比服务器端和本地文件的差异时,一会就断开ftp再也连不上了,弄了好久终于找到原因了,好像这个同步会频繁请求建立连接,服务器本地安全策略屏蔽了ip,还是下载后再做修改或者直接在 ...

  10. QR 二维码总结

    @(Java ThirdParty)[QR] QR 二维码总结 根据Wiki中的介绍,QR Code(Quick Response Code),二维条形码,由日志设计应用于汽车制造工业中.条形码中包含 ...