一、安装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. android Intent.ACTION_SEND

    ACTION_SEND intent 可以把自己的应用添加到系统的发送(分享)列表中. <intent-filter> <action android:name="andr ...

  2. js对象数组按属性快速排序

    前一篇<关于selector性能比赛>中提到,目测觉得在$("div,p,a")这样有逗号时,sizzle耗时异常(600多个元素,花了200ms),说是它可能没有优化 ...

  3. CentOS6.4 配置Haproxy

    Haproxy下载地址:http://pan.baidu.com/share/link?shareid=1787182295&uk=1829018343 也可用wget http://hapr ...

  4. 【BZOJ】1179: [Apio2009]Atm(tarjan+spfa)

    http://www.lydsy.com/JudgeOnline/problem.php?id=1179 缩点建图... #include <cstdio> #include <cs ...

  5. COJ1013 : WZJ的数据结构(十三)

    这道题有这样一个解法: 首先把边依次加到图中,若当前这条边与图中的边形成了环,那么把这个环中最早加进来的边弹出去并将每条边把哪条边弹了出去记录下来:ntr[i] = j,特别地,要是没有弹出边,ntr ...

  6. eclipse java工程和maven工程的互相转换

    eclipse java工程和maven工程的互相转换 maven转为工程一般工程: 工程右键--->Maven--->Disable Maven Nature转为一般工程. 一般工程转为 ...

  7. Linux kernel perf_swevent_init Local root Exploit

    64位上编译 另外修改了原Exploit的一个错误 第76行 把     uint64_t *p = (void *) ¤t[i]; 改成       uint64_t *p = (void *) & ...

  8. fastjson格式化bean的简易属性过滤器

    fastjson的bean属性过滤器 有的时候,我们在接口开发时,一个完整的bean会包含很多属性,但是前端接口只需要其中的某几个属性时,应该在对json的返回要进行精简.下面直接看代码 packag ...

  9. C++盲点

    const const指针 char greeting[] ="hello"; char* p = greeting; // non-const pointer, non-cons ...

  10. 【液晶模块系列基础视频】5.1X-GUI字体驱动1

    ============================= 技术论坛:http://www.eeschool.org 博客地址:http://xiaomagee.cnblogs.com 官方网店:ht ...