jquery 多页面项目，前后端未分离，在一个工程里面，用gulp(打包，压缩js,img,css)

1. 项目结构

2.压缩打包步骤 

1.    安装gulp
   npm install gulp --save-dev
2. 在项目根目录下创建一个名为 gulpfile.js 的文件
3. 控制台执行命令
   npm install  gulp-minify-css gulp-jshint gulp-uglify gulp-rename gulp-concat gulp-clean gulp-notify --save-dev
4. 图片压缩
   npm install gulp-imagemin --save-dev
5. 打包之前，一般需要先清空原来的文件，保证当前文件是最新的
   npm install --save-dev gulp-clean
6. 打包
   gulp build
   
    

3.gulpfile.js代码

// 引入 gulp及组件
const gulp=require('gulp');  //gulp基础库
const concat=require('gulp-concat');  //合并文件
const fileRename=require('gulp-rename');   //文件重命名
const notify=require('gulp-notify');   //提示
const clean = require('gulp-clean');//清理文件或文件夹
const watch = require('gulp-watch');
const cssUglify=require('gulp-minify-css'); //css压缩
const jsUglify=require('gulp-uglify');   //js压缩
const imageUglify = require('gulp-imagemin');//图片压缩


gulp.task('build',
    ['clean','copyBQLEditor','copyData','copy','copyHtml','copyFont','copyJson','cssCompress','jsCompress','imageCompress'],
    function(){console.log("压缩成功");});
// 监听
gulp.task('watch', function () {
    return w('src/main/webapp/solidbi/BQLEditor/**/*', 'copyBQLEditor');
    w('src/main/webapp/solidbi/BQLEditor', 'copyData');
    w('src/main/webapp/solidbi/resources/**/*', 'copy');
    w('src/main/webapp/solidbi/resources/solidbi/css/*.css', 'cssCompress');
    w('src/main/webapp/solidbi/resources/solidbi/js/*.js', 'jsCompress');
    w('src/main/webapp/solidbi/resources/solidbi/img/**/*.{png,jpg,gif,ico,jpeg}', 'imageCompress');
    w('src/main/webapp/solidbi/*.html', 'copyHtml');
    function w(path, task){
        watch(path, function () {
            gulp.start(task);
            browserSync.reload();
        });
    }
});

//css
gulp.task("cssCompress",function () {
    return   gulp.src("src/main/webapp/solidbi/resources/solidbi/css/*.css")  //设置css
            // .pipe(concat("app.css")) //合并css文件
            // .pipe(fileRename({ suffix:".min" }))//修改文件名
            .pipe(cssUglify())//压缩文件
            .pipe(gulp.dest("dist/resources/solidbi/css"))//输出文件目录
            .pipe(notify({message:'css task ok'}));   //提示成功
});
//js
gulp.task("jsCompress",function () {
    return gulp.src("src/main/webapp/solidbi/resources/solidbi/js/*.js")
            // .pipe(concat("app.js"))
            // .pipe(fileRename({ suffix:".min"}))
            .pipe(jsUglify())
            .pipe(gulp.dest("dist/resources/solidbi/js"))
            .pipe(notify({message:"js task ok"}));    //提示
});
//图片
gulp.task("imageCompress",function () {
    return gulp.src("src/main/webapp/solidbi/resources/solidbi/img/**/*.{png,jpg,gif,ico,jpeg}")
            .pipe(imageUglify({
                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/resources/solidbi/img"))
});
//font
gulp.task("copyFont", function () {
    return gulp.src('src/main/webapp/solidbi/resources/solidbi/font/**/*')
           .pipe(gulp.dest('dist/resources/solidbi/font'));
});
//json
gulp.task("copyJson", function () {
    return gulp.src('src/main/webapp/solidbi/resources/solidbi/json/*')
        .pipe(gulp.dest('dist/resources/solidbi/json'));
});

// 处理html
gulp.task("copyHtml",function () {
    return  gulp.src("src/main/webapp/solidbi/*.html")
            .pipe(gulp.dest("dist"))
});
gulp.task("copy", function () {
    return gulp.src([
        'src/main/webapp/solidbi/resources/**/*',
        '!src/main/webapp/solidbi/resources/solidbi/**'
    ],{nodir: true }).pipe(gulp.dest('dist/resources'));
});
gulp.task("copyBQLEditor", function () {
    return gulp.src("src/main/webapp/solidbi/BQLEditor/**/*")
        .pipe(gulp.dest("dist/BQLEditor"));
});
gulp.task("copyData", function () {
    return gulp.src("src/main/webapp/solidbi/data/*")
             .pipe(gulp.dest("dist/data"));
});
//  //删除Build文件
gulp.task('clean',function(){
    gulp.src('dist/',{read: false})
        .pipe(clean());
})