入门
http://www.tuicool.com/articles/FJVNZf
1、全局安装
sudo npm install -g gulp
以下需要进入项目目录：
2、项目安装
如果项目需要其他nodejs其它包，请先创建package.json，只用gulp,可以直接使用下面命令
cnpm install --save-dev gulp
3、安装gulp组件
例如：
npm install gulp-jshint gulp-sass gulp-concat gulp-uglify gulp-rename --save-dev
4、创建 gulpfile.js
// 引入 gulp var gulp = require(‘gulp‘); // 引入组件 var jshint = require(‘gulp-jshint‘); var sass = require(‘gulp-sass‘); var concat = require(‘gulp-concat‘); var uglify = require(‘gulp-uglify‘); var rename = require(‘gulp-rename‘); // 检查脚本 gulp.task(‘lint‘, function() { gulp.src(‘./js/*.js‘) .pipe(jshint()) .pipe(jshint.reporter(‘default‘)); }); // 编译Sass gulp.task(‘sass‘, function() { gulp.src(‘./scss/*.scss‘) .pipe(sass()) .pipe(gulp.dest(‘./css‘)); }); // 合并，压缩文件 gulp.task(‘scripts‘, function() { gulp.src(‘./js/*.js‘) .pipe(concat(‘all.js‘)) .pipe(gulp.dest(‘./dist‘)) .pipe(rename(‘all.min.js‘)) .pipe(uglify()) .pipe(gulp.dest(‘./dist‘)); }); // 默认任务 gulp.task(‘default‘, function(){ gulp.run(‘lint‘, ‘sass‘, ‘scripts‘); // 监听文件变化 gulp.watch(‘./js/*.js‘, function(){ gulp.run(‘lint‘, ‘sass‘, ‘scripts‘); }); });
5、命令行执行 gulp 即可
gulp default
6、其它
gulp只有五个方法： task ， run ， watch ， src ，和 dest 。
gulp本身不会处理，所有处理都需要第三方的组件
一些组件：
gulp-jshint 会检查js文件有没有报错或警告
gulp-htmlmin 压缩html，可以压缩页面javascript、css，去除页面空格、注释，删除多余属性等操作
gulp-uglify 压缩javascript文件，减小文件大小 注意还有合并，改名等，参见上面
gulp-clean-css 压缩css文件，减小文件大小，并给引用url添加版本号避免缓存
原文：http://www.cnblogs.com/mitang/p/5816290.html