一、安装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. LightOJ1051 Good or Bad(DP)

    这题感觉做法应该挺多吧,数据规模那么小. 我用DP乱搞了.. dp0[i][j]表示字符串前i位能否组成末尾有连续j个元音字母 dp1[i][j]表示字符串前i位能否组成末尾有连续j个辅音字母 我的转 ...

  2. 不容易系列之(4)——考新郎[HDU2049]

    不容易系列之(4)——考新郎 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others)To ...

  3. 精通CSS :nth-child伪类

    :nth-child 基本用法 :nth-child:nth-child(8) 选中第8个子元素 li:nth-child(8) span { background-color: #298EB2; b ...

  4. 调用WebServiceWebService提示The maximum string content length quota (8192) has been exceeded while reading XML data的解决办法

    在web.config中,bindings节点下,对应的服务名称中,原本可能是自动折叠的“/>”,需要改成手动折叠的</binding>,然后在中间加上<readerQuota ...

  5. 【BZOJ】1084: [SCOI2005]最大子矩阵(DP)

    http://www.lydsy.com/JudgeOnline/problem.php?id=1084 有一个1A--- 本题没看懂,,不会啊囧..感觉完全设不了状态..看了题解,囧,m<=2 ...

  6. SecureCrt脚本(二)二级对象之Dialog

    Crt自动化 测试 SecureCrt脚本 JS脚本   1.引言 2.Dialog属性和方法 2.1.属性 2.2.方法 2.2.1.FileOpenDialog 2.2.2.MessageBox ...

  7. StereoBM::disp12MaxDiff Crash the Release

    Initializing "cv::StereoBM bm.state->disp12MaxDiff" should be careful, inappropriate va ...

  8. 4.用文本编辑器输入课堂上练习的Hello.java,并在JDK环境下编译和运行。请将程序编译、运行的结果截图,填入下框中。

    一开始报错是因为在文本框了的:用的是中文下的,应该用英文下的;

  9. zabbix自定义键值原理

    子配置文件的配置 为了便于维护和分类管理,UserParameter的内容可以单独写一个配置文件 # vim /usr/local/zabbix/etc/zabbix_agentd.conf Incl ...

  10. android之打开网页

    首先改写strings.xml文件 代码如下: <resources> <string name="app_name">Intent应用</strin ...