platform-project/gulpfile.js

平台项目

let gulp = require('gulp');
let sass = require('gulp-sass');
let clean = require('gulp-clean');
let runSequence = require('run-sequence');
let cleanCSS = require('gulp-clean-css');
let cssSpriter = require('gulp-css-spriter-dookay');
let rename = require('gulp-rename');
let imageMin = require('gulp-imagemin');
let fileInclude = require('gulp-file-include');
let connect = require('gulp-connect');
let path = require('path');
let fs = require('fs');

//项目变量[项目名, 项目模式]
let envInfo = process.env.NODE_ENV.split('::');
//项目信息
let projectInfo = {
    name: envInfo[0],
    mode: envInfo[1],
    entry: path.join(__dirname, 'src/' + envInfo[0]),
    output: path.join(__dirname, 'dist/' + envInfo[0])
};
/*-------------------------------------*/
//清理输出目录
gulp.task('clean', () => {
    return gulp.src(projectInfo.output)
        .pipe(clean());
});
//sass转化css
gulp.task('sass-css', () => {
    return gulp.src(projectInfo.entry + '/scss/style.scss')
        .pipe(sass.sync().on('error', sass.logError))
        .pipe(gulp.dest(projectInfo.output + '/css'));
});
//css更名
gulp.task('css-rename', () => {
    return gulp.src(projectInfo.output + '/css/style.css')
        .pipe(clean())
        .pipe(rename((path) => {
            path.basename = 'style' + (projectInfo.mode == 'production' ? '-min' : '');
        }))
        .pipe(gulp.dest(projectInfo.output + '/css'));
});
//copy资源
gulp.task('copy-resource', () => {
    return gulp.src(projectInfo.entry + '/resources/image/**')
        .pipe(gulp.dest(projectInfo.output + '/images'))
});
//css雪碧图
// gulp.task('css-spriter', () => {
//     return gulp.src(projectInfo.output + '/css/*.css')
//         .pipe(cssSpriter({
//             spriteSheet: projectInfo.output + '/images/sprite/icon.png',
//             pathToSpriteSheetFromCSS: '../images/sprite/icon.png',
//             spritesmithOptions: {
//                 padding: 10
//             },
//             matchReg: {
//                 pattern: '\.\.\/images\/sprite\/'
//             }
//         }))
//         .pipe(gulp.dest(projectInfo.output + '/css'));
// });
//资源压缩
gulp.task('resource-min', () => {
    //css压缩
    gulp.src(projectInfo.output + '/css/*.css')
        .pipe(cleanCSS({ compatibility: 'ie8' }))
        .pipe(gulp.dest(projectInfo.output + '/css'));
    //图片压缩
    return gulp.src(projectInfo.output + '/images/**')
        .pipe(imageMin())
        .pipe(gulp.dest(projectInfo.output + '/images'));

});
//webpack
gulp.task('webpack', () => {
    let webpack = require('webpack')(require('./webpack.config')(projectInfo));
    return webpack.run((err, stats) => {
        // 模块分析工具
        // fs.writeFile('./ret.json', JSON.stringify(stats.toJson()), 'utf8', (err) => {
        //     if (err) throw err;
        //     console.log('done');
        // });
    });
});
//html-include
gulp.task('html-include', () => {
    return gulp.src(projectInfo.entry + '/html/*.html')
        .pipe(fileInclude({
            prefix: '@@',//变量前缀 @@include
            basepath: projectInfo.entry + '/html/',//引用文件路径
            indent: true,//保留文件的缩进
            context: {//页面中@@if语句中的变量
                projectInfo: {
                    mode: projectInfo.mode,
                    name: projectInfo.name
                }
            }
        }))
        .pipe(gulp.dest(projectInfo.output + '/html'));
});
//本地server
gulp.task('web-server', () => {
    connect.server({
        //host:'',
        root: 'dist/' + projectInfo.name,
        port: 3333,
        livereload: true,
        index: false,
        middleware: (connect, opt) => {
            let c = require('child_process');
            c.exec('start ' + 'http://' + opt.host + ':' + opt.port);
            return []
        }
    });
});
//初始化创建完成
let initCreateDone = function () {
    console.log('--初始化创建完成--');
    if (projectInfo.mode == 'production') { return }
    //web-server
    gulp.start('web-server');
    //默认参数
    let params = getTasks();
    params.push(() => {
        gulp.src(projectInfo.output + '/html/*.html')
            .pipe(connect.reload());
        console.log('更新完成');
    });
    //监听
    gulp.watch(projectInfo.entry + '/**', function () {
        runSequence.apply(null, params);
    });

};
//获取执行task
let getTasks = function () {
    let result = [['clean'], ['html-include', 'copy-resource', 'sass-css', 'webpack'], ['css-rename']/** , ['css-spriter'] */];
    //生产环境
    if (projectInfo.mode == 'production') {
        result.push(['resource-min']);
    }
    return result;
}
//默认执行
gulp.task('default', (cb) => {
    //默认参数
    let params = getTasks();
    //插入回调
    params.push(function () {
        cb();
        initCreateDone();
    });
    runSequence.apply(null, params);
});