gulp编译

1，nodejs环境

2，全局方式安装gulp  npm install -g gulp

3，全局安装gulp后，还需要在每个要使用gulp的项目中都单独安装一次

3，如果想在安装的时候把gulp写进项目package.json文件的依赖中，则可以加上--save-dev： npm install --save-dev gulp

4,npm国内墙的问题,建议使用cnpm替代,输入:npm install -g cnpm --registry=http://registry.npm.taobao.org在npm下安装cnpm,然后以后需要用到npm指令安装用cnpm指令替代能解决大部分无法获取的镜像

5, 1:gulp-rename 重命名 npm install --save-dev gulp-rename 

    2:gulp-uglify js文件压缩 npm install --save-dev gulp-uglify
    3:gulp-minify-csscss文件压缩npm install --save-dev gulp-minify-css
    4:gulp-minify-htmlhtml文件压缩npm install --save-dev gulp-minify-html
    5:gulp-less
less和sass的编译
npm install --save-dev gulp-less

// 引入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');
var minifyCss = require('gulp-minify-css');
var fs  = require('fs');
var replace = require('gulp-replace');
var htmlmin = require('gulp-htmlmin');
// var elixir = require('laravel-elixir');

// 压缩html，清除注释代码
gulp.task('html', function() {
    var htmlSrc = 'resources/assets/home/',
        htmlDist = 'public/home/';

    // 参数说明：http://www.jb51.net/article/85973.htm
    var isFormat = true;
    var options = {
        collapseWhitespace: isFormat,
        collapseBooleanAttributes: isFormat,
        removeComments: isFormat,
        removeEmptyAttributes: isFormat,
        removeScriptTypeAttributes: isFormat,
        removeStyleLinkTypeAttributes: isFormat,
        minifyJS: isFormat,
        minifyCSS: isFormat
    };

    var htmlBaseSrc  = 'resources/assets/home/',
        htmlBasePos  = '*.html',
        htmlBaseDist = 'public/home/';
    // 'community/',
    var htmlPosArr  = ['','bjc/','wxr/','academy/','community/','activity/','bond/','future/','guestActivity/','LkGroup/','register/','standardTail/','task/design/','task/lightTask/','task/publish/','user/','user/company/','user/designer/','user/person/','works/'];
    var htmlLen = htmlPosArr.length;

    for(var i=0; i < htmlLen; i++) {
        gulp.src(htmlBaseSrc+htmlPosArr[i]+htmlBasePos).pipe(htmlmin(options)).pipe(gulp.dest(htmlBaseDist+htmlPosArr[i]));
    }
});

// 编译sass并压缩
gulp.task('sass', function () {

    var cssBaseSrc = 'resources/assets/sass/',
        cssBaseDist = 'public/css/';

    var cssSrcArr = [['*.scss', ''], ['wxRegistScss/*.scss', 'wxRegistScss']],
        cssArrLen = cssSrcArr.length;

    for(var i=0; i < cssArrLen; i++) {

        gulp.src(cssBaseSrc+cssSrcArr[i][0]).pipe(sass()).pipe(minifyCss()).pipe(gulp.dest(cssBaseDist+cssSrcArr[i][1]));

    }

});

// 合并、压缩js文件
gulp.task('js', function() {
    var jsBaseSrc = 'resources/assets/js/',
        jsBaseDist = 'public/js/';
    // ['pay/*.js', 'pay'] , ['base/*.js', 'base']
    var jsSrcArr = [['*.js', ''],['util/*.js', 'util'],['base/*.js',"base"],['wxRegistJs/*.js','wxRegistJs']],
        jsArrLen = jsSrcArr.length;
    var config = {
        mangle: {except: ['define', 'require', 'exports', 'module', '$']},
        compress: true
    };
    /*gulp.src(jsSrc).pipe(concat('all.js')).pipe(gulp.dest(jsDist)).pipe(rename('all.min.js')).pipe(uglify(config)).pipe(gulp.dest(jsDist));*/
    for(var i=0; i < jsArrLen; i++) {
        gulp.src(jsBaseSrc+jsSrcArr[i][0]).pipe(gulp.dest(jsBaseDist+jsSrcArr[i][1]));
    }

    // gulp.src(jsSrc).pipe(gulp.dest(jsDist));
});

// 公共头部、尾部
gulp.task('hfooter', function() {

    var htmlBaseDir = 'resources/assets/home/';
    var replaceArr = ['', 'bond/', 'works/', 'task/design/','task/lightTask/', 'task/publish/', 'future/', 'guestActivity/', 'standardTail/', 'activity/', 'community/'];
    var replaceLen = replaceArr.length;

    for(var i=0; i < replaceLen; i++) {
        (function(i) {
            var htmlDir = htmlBaseDir+replaceArr[i];
            fs.readdir(htmlDir, function(err, files) {
                if (err) {
                    console.log(err);
                } else {
                    files.forEach(function(f) {
                        if (f !== 'head.html' && f !== 'footer.html') {
                            gulp.src(htmlDir + f)
                                .pipe(replace(/<!--header-->[\s\S]*<!--headerend-->/, '<!--header-->\n' + fs.readFileSync(htmlBaseDir + 'head.html', 'utf-8') + '\n<!--headerend-->'))
                                .pipe(replace(/<!--footer-->[\s\S]*<!--footerend-->/, '<!--footer-->\n' + fs.readFileSync(htmlBaseDir + 'footer.html', 'utf-8') + '\n<!--footerend-->'))
                                .pipe(replace(/<!--baidu_begin-->[\s\S]*<!--baidu_end-->/, fs.readFileSync(htmlBaseDir + 'baidu.js.html', 'utf-8')))
                                .pipe(gulp.dest(htmlDir))
                        }
                    });
                }
            });
        })(i);
    }


    // var htmlDirC = 'resources/assets/home/community/';
    // var replaceDirC = 'resources/assets/home/';
    // fs.readdir(htmlDirC, function(err, files) {
    //     if (err) {
    //         console.log(err);
    //     } else {
    //         files.forEach(function(f) {
    //             if (f !== 'head.html' && f !== 'footer.html') {
    //                 gulp.src(htmlDirC + f)
    //                     .pipe(replace(/<!--header-->[\s\S]*<!--headerend-->/, '<!--header-->\n' + fs.readFileSync(htmlDirC + 'head.html', 'utf-8') + '\n<!--headerend-->'))
    //                     .pipe(replace(/<!--footer-->[\s\S]*<!--footerend-->/, '<!--footer-->\n' + fs.readFileSync(replaceDirC + 'footer.html', 'utf-8') + '\n<!--footerend-->'))
    //                     .pipe(replace(/<!--baidu_begin-->[\s\S]*<!--baidu_end-->/, fs.readFileSync(replaceDirC + 'baidu.js.html', 'utf-8')))
    //                     .pipe(gulp.dest(htmlDirC))
    //             }
    //         });
    //     }
    // });

  
    var htmlDir = 'resources/assets/home/academy/';
    var replaceDir = 'resources/assets/home/';
    fs.readdir(htmlDir, function(err, files) {
        if (err) {
            console.log(err);
        } else {
            files.forEach(function(f) {
                if (f !== 'head.html' && f !== 'footer.html') {
                    gulp.src(htmlDir + f)
                        .pipe(replace(/<!--header-->[\s\S]*<!--headerend-->/, '<!--header-->\n' + fs.readFileSync(htmlDir + 'head.html', 'utf-8') + '\n<!--headerend-->'))
                        .pipe(replace(/<!--footer-->[\s\S]*<!--footerend-->/, '<!--footer-->\n' + fs.readFileSync(replaceDir + 'footer.html', 'utf-8') + '\n<!--footerend-->'))
                        .pipe(gulp.dest(htmlDir))
                }
            });
        }
    });

    // 个人中心 （企业、设计师、普通用户）
    var userDirArr = [['user/designer/', 'userHead.html'],['user/person/', 'userHeadP.html'],['user/company/', 'userHeadC.html']];
    var userLen = userDirArr.length;

    for(var i=0; i < userLen; i++) {
        (function(i) {
            var htmlDir = htmlBaseDir + userDirArr[i][0];
            fs.readdir(htmlDir, function(err, files) {
                if (err) {
                    console.log(err);
                } else {
                    files.forEach(function(f) {
                        if (f !== userDirArr[i][1] && f !== 'footer.html') {
                            gulp.src(htmlDir + f)
                                .pipe(replace(/<!--header-->[\s\S]*<!--headerend-->/, '<!--header-->\n' + fs.readFileSync(htmlBaseDir + userDirArr[i][1], 'utf-8') + '\n<!--headerend-->'))
                                .pipe(replace(/<!--footer-->[\s\S]*<!--footerend-->/, '<!--footer-->\n' + fs.readFileSync(htmlBaseDir + 'footer.html', 'utf-8') + '\n<!--footerend-->'))
                                .pipe(replace(/<!--baidu_begin-->[\s\S]*<!--baidu_end-->/, fs.readFileSync(htmlBaseDir + 'baidu.js.html', 'utf-8')))
                                .pipe(gulp.dest(htmlDir))
                        }
                    });
                }
            });
        })(i);
    }

    /* setTimeout(function() {
     gulp.run('html');
     },3000); */
});

gulp.task('watch', function() {

    gulp.watch(['resources/assets/sass/fag.scss', 'resources/assets/js/fag.js'], function() {
        gulp.run('signle');
    });

    gulp.run('signle');

});


gulp.task('signle', function() {

    /**
     * @type CSS
     */
    var cssBaseSrc = 'resources/assets/sass/',
        cssBaseDist = 'public/css/';

    var cssSrcArr = [['fag.scss', '']],
        cssArrLen = cssSrcArr.length;

    for(var i=0; i < cssArrLen; i++) {

        gulp.src(cssBaseSrc+cssSrcArr[i][0]).pipe(sass()).pipe(minifyCss()).pipe(gulp.dest(cssBaseDist+cssSrcArr[i][1]));
    }


    /**
     * @type html
     */
    var htmlBaseSrc  = 'resources/assets/home/',
        htmlBasePos  = '*.html',
        htmlBaseDist = 'public/home/';

    var htmlPosArr  = ['standardTail/'];
    var htmlLen = htmlPosArr.length;
    for(var i=0; i < htmlLen; i++) {
        gulp.src(htmlBaseSrc+htmlPosArr[i]+htmlBasePos).pipe(gulp.dest(htmlBaseDist+htmlPosArr[i]));
    }


    /**
     * @type js
     */
    var jsBaseSrc = 'resources/assets/js/',
        jsBaseDist = 'public/js/';
    var jsSrcArr = [['fag.js','']],
        jsArrLen = jsSrcArr.length;
    var config = {
        mangle: {except: ['define', 'require', 'exports', 'module', '$']},
        compress: true
    };

    for(var i=0; i < jsArrLen; i++) {
        gulp.src(jsBaseSrc+jsSrcArr[i][0]).pipe(gulp.dest(jsBaseDist+jsSrcArr[i][1]));
    }


});


gulp.task('default', function() {

    gulp.run('watch');
});