一、安装node

https://nodejs.org/download/

根据需要选择对应的版本

安装好了之后可以通过node -v参看一下版本

node -v

二、安装gulp

npm install -g gulp

进入项目目录

由于已经全局安装了gulp

(但是要保证全局版本与本地版本一致。最好重新安装一下

npm install --save-dev gulp

安装好了之后

gulp –v

全局gulp与本项目下的gulp版本一致了。

三、安装插件

npm install --save-dev gulp-jshint

npm install --save-dev gulp-uglify

npm install --save-dev gulp-concat

npm install --save-dev gulp-sass

npm install --save-dev gulp-rename

npm install --save-dev gulp-imagemin

npm install --save-dev imagemin-pngquant

(如果安装不了,可换用淘宝镜像npm --registry https://registry.npm.taobao.org install --save-dev gulp-jshint)

安装好了之后运根据配置文件执行任务(也可以设置默认任务)

下面我们来执行图片压缩任务

gulp libs:imagemin

当看到这里是我们的图片压缩任务已经完成了。

参考链接:

http://javascript.ruanyifeng.com/tool/gulp.html

https://github.com/gulpjs/gulp

http://gulpjs.com/plugins/

http://javascript.ruanyifeng.com/tool/gulp.html

http://www.tuicool.com/articles/ea6FVf

http://markpop.github.io/2014/09/17/Gulp入门教程/

http://gulpjs.com/plugins/

http://www.zhixing123.cn/computer/gulp.html

http://sentsin.com/web/861.html

Gulp自动化工具之图片压缩的更多相关文章

  1. java使用google开源工具实现图片压缩【转】

    jar包名 import net.coobird.thumbnailator.Thumbnails; import net.coobird.thumbnailator.geometry.Positio ...

  2. 四:Java使用google的thumbnailator工具对图片压缩水印等做处理

    Thumbnailator是一个非常好的图片开源工具 使用方法: 在pom中加入以下jar包 <!-- 图片缩略图 图片压缩 水印 start--> <dependency>& ...

  3. java使用google开源工具实现图片压缩

    前言 作为靠谱的java服务端程序员,图片这个事情一直是个头疼的事情. 现在很多网站上,都有上传图片这个功能,而图片对于现在的很多手机来说,拍摄出来的都是高清图片,分辨率也是相当的高,当然占用的存储空 ...

  4. gulp打包工具

    首先安装全局gulp $ npm install --global gulp 下载成功后 新建一个项目或者一个文件夹(做测试) mkdir testgulp 在该文件或者项目下下载gulp工具 $ n ...

  5. java:图片压缩

    java使用google开源工具实现图片压缩 :http://www.cnblogs.com/linkstar/p/7412012.html

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

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

  7. 前端自动化工具gulp自动添加版本号

    之前,我介绍了学习安装并配置前端自动化工具Gulp,觉得gulp确实比grunt的配置简单很多,于是我决定再深入学习一下gulp,就去网上查了资料,发现gulp还可以自动添加版本号,这个功能就为我平时 ...

  8. Node.js前端自动化工具:gulp

    前端自动化工具 -- gulp 使用简介 gulp是基于流的前端自动化构建工具. 之前也谈到了 grunt的用法,grunt其实就是配置+配置的形式. 而gulp呢,是基于stream流的形式,也就是 ...

  9. Gulp 自动化的项目构建工具

    在很多场合都会听到前端工和 node 程师推荐 Grunt 来实现项目的自动化,自动化可以自动完成 javascript/coffee/sass/less 等文件的的测试.检查.合并.压缩.格式化.部 ...

随机推荐

  1. Unity3D安装多版本

    今天我也遇到这个版本更换问题.  老外也遇到了的!哈哈. 错误提示是: Fatal error!type = =kMetaAssetType & pathName.find("lib ...

  2. 操作properties文件,注意抹掉最前面的"file:"

    package com.xiewanzhi.property; import java.io.BufferedInputStream; import java.io.File; import java ...

  3. BZOJ1100 : [POI2007]对称轴osi

    将多边形转化为如下的环: 1到2的边,角2,2到3的边,角3,...,n-1到n的边,角n,n到1的边,角1 然后枚举对称轴,如果i是对称轴,那么[i-n,i+n]是一个回文串 用Manacher算法 ...

  4. 生产环境下一定要开启mysqlbinlog

    在没有备份数据库的情况下,可以用binlog进行恢复 在生产环境下安全第一,损失一点点效率换来的安全还是值得的. http://www.cnblogs.com/zc22/archive/2013/06 ...

  5. NSMutableArray 存放BOOL

    注意BOOL是不能直接存放在NSMutableArray中的 NSNumber* yesObj = [NSNumber numberWithBool:YES]; NSMutableArray* arr ...

  6. WebRTC手记之WebRtcVideoEngine2模块

    转载请注明出处:http://www.cnblogs.com/fangkm/p/4401143.html 终于讲到视频数据的编码发送模块了,不容易.总体来说也看了不少时间WebRTC的源码了,最大的感 ...

  7. Notepad++ Shortcuts 快捷键

    Ctrl-C   Copy Ctrl-X   Cut Ctrl-V   Paste Ctrl-Z   Undo Ctrl-Y   Redo Ctrl-A   Select All Ctrl-F   L ...

  8. https的了解

    经常用支付宝,看到了https就查了一下. HTTPS(Secure Hypertext Transfer Protocol)安全超文本传输协议. 简单讲是HTTP的安全版.即HTTP下加入SSL层, ...

  9. Angular数据双向绑定

    Angular数据双向绑定 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前端JS框架,已经被用于Google的多款产品当中.Angul ...

  10. Servlet 编程 http请求类型

    HTTP协议的8种请求类型介绍 HTTP协议中共定义了八种方法或者叫“动作”来表明对Request-URI指定的资源的不同操作方式,具体介绍如下: OPTIONS:返回服务器针对特定资源所支持的HTT ...