gulp安装

入门指南
http://www.gulpjs.com.cn/
http://www.gulpjs.com.cn/docs/getting-started/
前端构建工具gulpjs的使用介绍及技巧

插件库
https://www.npmjs.com/search
http://gulpjs.com/plugins/
gulp-usemin : https://www.npmjs.com/package/gulp-usemin

gulp教程之gulp中文API
http://www.ydcss.com/archives/424
gulp详细入门教程
http://www.ydcss.com/archives/18
http://jingyan.baidu.com/article/14bd256e7f7d7fbb6d2612c4.html

gulp教程之gulp-imagemin：
http://www.ydcss.com/archives/26
深度壓縮圖片: http://fanli7.net/a/JAVAbiancheng/ANT/20160508/561425.html
gulp-imagemin github文档

Gulp使用指南
http://www.techug.com/gulp

gulp-htmlmin压缩html
http://www.jb51.net/article/85973.htm

var gulp = require('gulp'),
    sass = require('gulp-sass'),
    imagemin = require('gulp-imagemin');

/* 定义builtSass任务 */
gulp.task('builtSass', function () {
    gulp.src(['static/**/*.scss'])   /* 任务源文件 */
        .pipe(sass())                /* 任务调用模块 */
        .pipe(gulp.dest('static'));  /* 任务目标文件导出目录 */
});

/* 定义watchSass任务 */
gulp.task('watchSass', function () {
    return gulp.watch('static/**/*.scss',['builtSass'])  /* 监听scss文件 */
});


gulp.task('testImagemin', function () {
    gulp.src('static/**/*.{png,jpg,jpeg,gif,bmp,ico}')
        .pipe(imagemin())
        .pipe(gulp.dest('static'));
});

gulp.task('default',['builtSass','watchSass','testImagemin']);

红包项目的gulpfile.js

var gulp = require('gulp'),
    imagemin = require('gulp-imagemin'),
    htmlmin = require('gulp-htmlmin');


gulp.task('builtImagemin', function () {
    gulp.src('develop/**/*.{png,jpg,jpeg,gif,bmp,ico}')
        .pipe(imagemin({
            optimizationLevel: 5, //类型：Number  默认：3  取值范围：0-7（优化等级）
            progressive: true, //类型：Boolean 默认：false 无损压缩jpg图片
        }))
        .pipe(gulp.dest('master'));
});

gulp.task('builtHtmlmin', function () {
    gulp.src('develop/**/*.html')
        .pipe(htmlmin({
            collapseWhitespace:true,
            collapseBooleanAttributes:true,
            removeComments:true,
            removeEmptyAttributes:true,
            removeScriptTypeAttributes:true,
            removeStyleLinkTypeAttributes:true,
            minifyJS:true,
            minifyCSS:true
        }))
        .pipe(gulp.dest('master'));
});

gulp.task('default',['builtImagemin','builtHtmlmin']);

/**
 * Created by yetao on 2017/6/7.
 *
 */
var gulp = require('gulp'),
    sass = require('gulp-sass');
    rubySass = require('gulp-ruby-sass');


var _project = "July88Sass";
var _projectPath = "July88";
module.exports.name = _project;

module.exports.func = function(){
        
        var sourcePath = _projectPath+'/',
            targetPath = '../../master/app/'+_projectPath+'/';
        //gulp-ruby-sass
        gulp.task('builtRubySass', () =>
            rubySass(sourcePath+'css/*.scss')
                .on('error', sass.logError)
                .pipe(gulp.dest(sourcePath+'css/'))
        );
        //gulp-sass
        gulp.task('builtSass', function () {
            gulp.src([sourcePath+'css/*.scss'])   /* 任务源文件 */
                .pipe(sass())                /* 任务调用模块 */
                .pipe(gulp.dest(sourcePath+'css/'));  /* 任务目标文件导出目录 */
        });

        gulp.task('watchSass', function () {
            gulp.watch(sourcePath+'css/*.scss',['builtRubySass'])  /* 监听scss文件 */
        }());

        console.log('watching');
        return ;
}

module.exports.op = function () {
    gulp.task(_project, this.func);
}

安装已有项目
cnpm install