gulp入门

1、安装gulp

gulp和grunt类似，都是一种自动化工具。与grunt不同的是，gulp是一种流操作模式，而grunt是会创建临时文件来继续操作，简要如图：

图示grunt写错了。

因为grunt操作会创建临时文件，会有频繁的IO操作，而gulp使用的是流操作，一直是在内存中处理，直到输出结果。

首先需要全局安装gulp：

npm install gulp -g

然后切换到本地项目里，本地安装gulp：

npm install gulp -SD

然后接下来的就是安装各种gulp插件，见下文。

2、使用gulp

gulp目前也有丰富的插件可配置。常用的插件有uglify、rename、concat、jshint等（详见参考地址）。

示例安装压缩js文件为min.js：

先安装gulp-uglify：

npm install -SD gulp-uglify gulp-rename

然后在项目根目录创建gulpfile.js，内容为：

// 引入gulpvar mGulp = require('gulp'); // 引入gulp组件（插件）var mUglify = require('gulp-uglify');var mRename = require('gulp-rename'); // 定义gulp任务mGulp.task('minjs', function() {	// 源地址	mGulp.src('./js/*.js')	// 压缩	.pipe(mUglify({		// 保留部分注释		preserveComments: 'some',	}))	// 重命名	.pipe(mRename({		// 文件后缀		extname: '.min.js',	}))	// 目标地址	.pipe(mGulp.dest('./js/'));});

在命令行输入：

gulp minjs

即可见证奇迹。