gulp学习
中文文档:http://www.gulpjs.com.cn/docs/api/
一、gulp的API
1 gulp.src();
这个方法是用来获取流的,但这个流里的内容不是原始的文件流,而是一个虚拟文件对象流,这个虚拟文件对象中存储着原始文件的路径、文件名、内容等信息。
其语法为:
gulp.src(globs[, options]);
2 gulp.dest();
gulp.dest()方法是用来写文件的。
其语法为:
gulp.dest(path[,options])
3 gulp.task()
这个方法用来定义任务,内部使用的是Orchestrator。
其语法为:
  gulp.task(name[, deps], fn)
4 gulp.watch()
这个方法用来监视文件的变化,当文件发生变化后,我们可以利用它来执行相应的任务,例如文件压缩等。
其语法为
gulp.watch(glob[, opts], tasks)
二、pipe方法
将文件流导入到gulp的插件或者api方法中;
三、一些常用的gulp插件
1 自动加载插件
gulp-load-plugins,安装:npm install --save-dev gulp-load-plugins
2 重命名插件
gulp-rename,安装:npm install --save-dev gulp-rename
3 js文件压缩
gulp-uglify,安装:npm install --save-dev gulp-uglify
4 css文件压缩
gulp-minify-css,安装:npm install --save-dev gulp-minify-css
5 html文件压缩
gulp-minify-html,安装:npm install --save-dev gulp-minify-html
6 js代码检查
gulp-jshint,安装:npm install --save-dev gulp-jshint
7 文件合并
gulp-concat,安装:npm install --save-dev gulp-concat
8 less和sass的编译
less使用gulp-less,安装:npm install --save-dev gulp-less
sass使用gulp-sass,安装:npm install --save-dev gulp-sass
9 图片压缩
gulp-imagemin,安装:npm install --save-dev gulp-imagemin
10 自动刷新
gulp-livereload,安装:npm install --save-dev gulp-livereload
gulp学习的更多相关文章
- gulp学习笔记4
		gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 之前的任务都是单个的,比较简单.接下去我们开始引用多个插件,一次性把任务搞定,省 ... 
- Gulp学习指南之CSS合并、压缩与MD5命名及路径替换(转载)
		本文转载自: Gulp学习指南之CSS合并.压缩与MD5命名及路径替换 
- gulp学习笔记1
		gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.安装gulp 首先我们需要node环境,nodejs安装这里就不说了,不懂的 ... 
- gulp学习笔记2
		gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1. 压缩 CSS 压缩 css 代码可降低 css 文件大小,提高页面打开速度 ... 
- gulp学习笔记3
		gulp系列学习笔记: 1.gulp学习笔记1 2.gulp学习笔记2 3.gulp学习笔记3 4.gulp学习笔记4 1.编译sass Sass 是一种 CSS 的开发工具,提供了许多便利的写法,大 ... 
- Gulp 学习总结
		Gulp 自动化工具开发非常方便,便于上手,值得使用. 一.Gulp安装 gulp是基于NodeJS运行的,所以需要想安装NodeJS. http://nodejs.org/download/ 安装 ... 
- gulp 学习笔记
		以这次学习gulp为契机来同时了解和学习node相关的知识和概念,比如 npm,package.json等,为以后学习node打好基础. 目录 npm 查看模块 安装模块 ... 
- gulp学习笔记——最好的学习文档是官网
		官网:http://www.gulpjs.com.cn/docs/api/ 当然还有一个博客写的也很好,当我看不下去官网的时候,这个帮助了我很多,明了易懂:http://www.ydcss.com/a ... 
- 前端自动化构建工具 gulp 学习笔记 一、
		一.我对gulp的初期理解 是一种前端辅助开发工具 可以帮你把js,css,img等文件 合并.压缩,图片好像是合并为精灵图,合并为精灵图之后,还会生成一个css样式表. 官方解说是:基于流的自动化构 ... 
- gulp学习-metamask前端使用
		https://www.gulpjs.com.cn/docs/getting-started/ ,这个是3.9.0版本 后面发现安装的版本是4.0.0,看下面这个: https://github.co ... 
随机推荐
- shell来start、stop、restart应用程序模板
			这里使用shell中的case语法: case分支语句格式如下: case $变量名 in 模式1) 命令列表 ;; 模式2) 命令列表 ;; *) ;; esac case行尾必须为单词“in”,每 ... 
- IL速查
			名称 说明 Add 将两个值相加并将结果推送到计算堆栈上. Add.Ovf 将两个整数相加,执行溢出检查,并且将结果推送到计算堆栈上. Add.Ovf.Un 将两个无符号整数值相加,执行溢出检查,并且 ... 
- 各种UserAgent的列表
			User Agent是浏览器用于 HTTP 请求的用户代理头的值.更换User Agent能更好的模拟出不同的系统和浏览器信息. Android Name User Agent Nexus 7 (Ta ... 
- viewWithTag获取subview规则详解
			通常我们在view层级里面对subView的操作可以通过两种方式:1.保留一个subview的引用,然后在类中通过该引用对该subview进行操作,但是要注意在适当的位置添加内存维护的代码,退出前手动 ... 
- Could not get BatchedBridge, make sure your bundle is packaged correctly
			react-native 运行android项目的时候运行成功但是模拟器上会提示: Could not get BatchedBridge, make sure your bundle is pack ... 
- HTML5[4]:去除不必要的标签,完全使用css实现样式
			1)div.span的区别,div默认是沾满一行,span默认是inline 2)去除font之类的标签 
- Office Online简介
			一.什么是Office Online Office Online 将 Microsoft Office 体验扩展到了 Web 浏览器,这使您可以直接在存储文档的 SharePoint 网站上处理文档, ... 
- Hadoop第12周练习—HBase安装部署
			1 1.1 1.2 :安装HBase 2.1 内容 运行环境说明 1.1 硬软件环境 线程,主频2.2G,6G内存 l 虚拟软件:VMware® Workstation 9.0.0 build-8 ... 
- IOS开发UI基础UIPikerView的属性
			UIPikerView的属性 1. numberOfComponents:返回UIPickerView当前的列数NSInteger num = _pickerView.numberOfComponen ... 
- mysql修改definer方法
			-- 函数.存储过程 select definer from mysql.proc; update mysql.proc set definer='billing@%'; -- 定时事件 sele ... 
