gulp自己项目中的完整配置,欢迎完善

var gulp = require('gulp');
var cssmin = require('gulp-minify-css');            //css压缩
var uglify = require('gulp-uglify');                //js压缩
var concat = require('gulp-concat');                //js合并
var imagemin = require('gulp-imagemin');            //图片的压缩
var base64 = require('gulp-base64');                //css小图片转成base64字符串
var htmlbase64 = require('gulp-html-css-js-base64');//html小图片转成base64字符串,这个插件还不完善,有空会改编一下
var htmlmin = require('gulp-htmlmin');              //html的压缩

//压缩css文件和base64 和文件名加md5后缀
gulp.task('testCssmin', function () {
    gulp.src('skin/css/common.css')
        .pipe(base64({maxImageSize: 40 * 1024}))     //40k以内图片转base64
        // .pipe(rev())                              //文件名加md5后缀
        .pipe(cssmin())
        // .pipe(rev.manifest())                //rev-mainfest.json文件,里面是压缩文件的信息
        .pipe(gulp.dest('dist/css'));
});

// 合并和压缩js文件
gulp.task('testScriptmin', function () {
    gulp.src(['skin/js/jquery.SuperSlide.2.1.1.js', 'skin/js/common.js'])
        .pipe(concat('common.js'))                        //合并js
        .pipe(uglify({mangle: false, compress: false}))   //压缩js,是否修改变量名,是否完全压缩
        .pipe(gulp.dest('dist/js'))
});

//压缩img文件
gulp.task('testImagemin', function () {
    gulp.src('images/*.{png,jpg,gif,ico}')
        .pipe(imagemin({
            optimizationLevel: 5,                       //类型:Number  默认:3  取值范围:0-7(优化等级)
            progressive: true,                          //类型:Boolean 默认:false 无损压缩jpg图片
            interlaced: true,                           //类型:Boolean 默认:false 隔行扫描gif进行渲染
            multipass: true                             //类型:Boolean 默认:false 多次优化svg直到完全优化
        }))
        .pipe(gulp.dest('dist/images'));
});

//html小图片转成base64字符串
gulp.task('testHtmlbase64', function () {
    gulp.src('index.html')
        .pipe(htmlbase64({maxImageSize: 80 * 1024}))  //80k以内图片转为base64
        .pipe(gulp.dest('dist/base64'));
});

//压缩html文件
gulp.task('testHtmlmin', function () {
    var options = {
        removeComments: true,                           //清除HTML注释
        collapseWhitespace: true,                       //压缩HTML
        collapseBooleanAttributes: true,                //省略布尔属性的值  ==> 
        removeEmptyAttributes: true,                    //删除所有空格作属性值  ==> 
        removeScriptTypeAttributes: true,               //删除
                    
                    

你可能感兴趣的:(gulp自己项目中的完整配置,欢迎完善)