gulp打包项目配置

gulpfile.js

var gulp=require('gulp');

var htmlMin = require('gulp-htmlmin') //压缩html
var uglify = require('gulp-uglify');//压缩js
var babel=require('gulp-babel');//es6转es5
var cleanCSS=require('gulp-clean-css');//压缩css
var  imagemin = require('gulp-imagemin');//压缩图片
var cache = require('gulp-cache');//只处理修改的内容图片
var clean = require('gulp-clean');//清空文件夹
gulp.task('htmlMin', function () {
  var options = {
    removeComments: true, //清除HTML注释
    collapseWhitespace: true, //压缩HTML
    collapseBooleanAttributes: true, //省略布尔属性的值 <input checked="true"/> ==> <input />
    removeEmptyAttributes: true, //删除所有空格作属性值 <input id="" /> ==> <input />
    removeScriptTypeAttributes: true, //删除<script>的type="text/javascript"
    removeStyleLinkTypeAttributes: true, //删除<style>和<link>的type="text/css"
    minifyJS: true, //压缩页面JS
    minifyCSS: true //压缩页面CSS
  };
  return gulp.src('src/*.html')
    .pipe(htmlMin(options))
    .pipe(gulp.dest('dist'))
});

// 压缩js
gulp.task('uglifyJs', function () {
    return gulp.src(['src/js/*.js'])
     .pipe(babel(
         {
            presets: ['es2015']
         }
     ))
      .pipe(uglify()) //加入uglify()的处理
      .pipe(gulp.dest('dist/js'))
     
  });

//   压缩css任务
gulp.task('css',function(){
    return gulp.src('src/style/*.css')
       .pipe(cleanCSS())
       .pipe(gulp.dest('dist/style'))
});

// 压缩图片
gulp.task('Imagemin',function(){
    return gulp.src('src/img/*.{png,jpg,gif,jpeg,ico}')
    .pipe(
        cache(
          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/img'));
})



// 拷贝fonts文件夹
gulp.task('copyFonts',function(){
  return gulp.src('src/fonts/*')
             .pipe(gulp.dest('dist/fonts'));
});


// 清空文件夹，保证每次都打包都是最新文件
gulp.task('clean',function(){
  return gulp.src('dist')
     .pipe(clean());
})

// gulp.task("default",gulp.series('htmlMin','uglifyJs','css','Imagemin'));
// 这里这样写的意义是有可能会出现一种情况（其他文件处理速度快的已经处理完了，然后clean最后才执行，会把前面处理完的文件删掉，所以要用到gulp.parallel）
gulp.task("default",gulp.series('clean',gulp.parallel('htmlMin','uglifyJs','css','copyFonts','copyLib','copyStatic','Imagemin','Imagemin1')));