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图片压缩的更多相关文章
- gulp之压缩图片
//先全局安装gulp:npm install -g gulp //然后在项目根目录中安装gulp依赖:npm install --save-dev gulp //http://www.gulpjs. ...
- 前端构建工具之gulp(一)「图片压缩」
前端构建工具之gulp(一)「图片压缩」 已经很久没有写过博客了,现下终于事情少了,开始写博吧 今天网站要做一些优化:图片压缩,资源合并等 以前一直使用百度的FIS工具,但是FIS还没有提供图片压缩的 ...
- gulp-imagemin图片压缩----gulp系列(三)
本节实现图片压缩,在实现压缩前,先配置images任务,设置源目录和输出目录. 在系列(二)代码的基础上,再进行扩展. 1.找到gulp->config.js,对images进行源目录(src- ...
- Gulp自动化工具之图片压缩
一.安装node https://nodejs.org/download/ 根据需要选择对应的版本 安装好了之后可以通过node -v参看一下版本 node -v 二.安装gulp npm insta ...
- Gulp 之图片压缩合并
同事需要处理很多的图片,由于UI那边提供图片比较大,为了性能好一点,程序包小一点,因此希望我帮忙做成小程序来完成此工作. 其实之前做过一个grunt写的图片压缩合并工具,当时是为了处理270多个国家/ ...
- 玩转gulp之压缩打包热重载
上节上上节我们讲了gulp的sass编译和watch监听,动态加载 这样我们就可以做到,我管我写我的sass然后保存,自动编译,就好像我们在写css一样,这是一个自动化的一大步.我们呱唧呱唧. 我们已 ...
- Golang 编写的图片压缩程序,质量、尺寸压缩,批量、单张压缩
目录: 前序 效果图 简介 全部代码 前序: 接触 golang 不久,一直是边学边做,边总结,深深感到这门语言的魅力,等下要跟大家分享是最近项目 服务端 用到的图片压缩程序,我单独分离了出来,做成了 ...
- 三款不错的图片压缩上传插件(webuploader+localResizeIMG4+LUploader)
涉及到网页图片的交互,少不了图片的压缩上传,相关的插件有很多,相信大家都有用过,这里我就推荐三款,至于好处就仁者见仁喽: 1.名气最高的WebUploader,由Baidu FEX 团队开发,以H5为 ...
- Android 图片压缩、照片选择、裁剪,上传、一整套图片解决方案
1.Android一整套图片解决方案 http://mp.weixin.qq.com/s?__biz=MzAxMTI4MTkwNQ==&mid=2650820998&idx=1& ...
随机推荐
- JS中字符串的true转化为boolean类型的true
var a="True"; a = eval(a.toLowerCase()); alert(typeof a); //boolean alert(a);//true 正解,eva ...
- [Network Analysis] 复杂网络分析总结
在我们的现实生活中,许多复杂系统都可以建模成一种复杂网络进行分析,比如常见的电力网络.航空网络.交通网络.计算机网络以及社交网络等等.复杂网络不仅是一种数据的表现形式,它同样也是一种科学研究的手段.复 ...
- Docker 简介
1.什么是Docker Docker 是一个开源的应用容器引擎,让开发者可以打包他们的应用以及依赖包到一个可移植的镜像中,然后发布到任何流行的 Linux 机器上.使用Docker可以让每个应用彼此相 ...
- 供销大集-JS修改
aes("a123456") 1.搜索password 可以猜测 寻找匹配项 然后把密码 给t 2.也可以直接直接从这里往上,找到一个 encrypt函数下断点调试输出 funct ...
- UIButton快速点击,只执行最后一次
button快速点击时,会导致,同一动作执行多次,常用解决办法: 第一种方法:推荐 //取消执行 [[self class] cancelPreviousPerformRequestsWithTarg ...
- Mysql数据库 - 增删改
一. Create 1. 单条插入, sql格式: insert into (列名) values(列值); INSERT INTO test.tch_teacher ( Sex, BId, NO, ...
- table里面,怎么根据checkbox选择的一行中的某个单元格的值是否为空,来判断是否该选中
<table class="stripe" id="tab2"> <tr> <th>选择</th> <th ...
- java面向对象---对象容器
泛型类--ArrayList<>; 2.对象数组中的每个元素都是对象的管理者而并非对象本身!!!!! 3.java类的基本数据类型 基本数据类型 包装类 byte Byte short S ...
- pureftp在centos下与MySQL搭配使用
概述 pure-ftpd是linux下的一个ftp服务端,据说安全性较高.我在centos6下用yum安装pure-ftpd,并配置了通过MySQL进行用户的增删改查,以及对应到apache的web目 ...
- ffmpeg 音频转换(amr2mp3)
yasm:http://yasm.tortall.net/Download.html(汇编器,新版本的ffmpeg增加了汇编代码) lame:http://lame.sourceforge.net/d ...