gulpfile.js的配置

来源:互联网 发布:劳动力密集型产业知乎 编辑:程序博客网 时间:2024/06/05 22:41
var gulp = require('gulp');
var less = require('gulp-less');
var autoprefixer = require('gulp-autoprefixer');
// 压缩css
var mincss = require('gulp-clean-css');
var clean = require('gulp-clean');
// 压缩图片
var imagemin = require('gulp-imagemin');
// Browsersync
var browserSync = require('browser-sync').create();
//错误处理
var plumber = require('gulp-plumber');
var notify = require("gulp-notify");




//Src
var src = {
    html: './src/**/*.html',
    less: './src/less/**/*.less',
    css: './src/less/**/*.css',
    script: './src/script',
    images: './src/images',
    lib: './src/lib/**/*.*'
};
// build
var build = {
    html: './build',
    css: './build/css',
    js: './build/js',
    img: './build/img',
    lib: './build/lib',
    path: './build'
}


// Clean build
gulp.task('clean', function () {
    return gulp.src(build.path)
        .pipe(clean())
});


// 创建服务器
gulp.task('Server', ['watch'], function () {
    browserSync.init({
        server: {
            baseDir: './build',
            index: 'index.html'
        }
    });
});


// Copyhtml
gulp.task('Copyhtml', function () {
    gulp.src(src.html)
        .pipe(gulp.dest(build.html));
});
//Less
gulp.task('Less', function () {
    return gulp.src(src.less)
        .pipe(less())
        .pipe(plumber({
            errorHandler: notify.onError("Error: <%= error.message %>")
        }))
        .pipe(autoprefixer())
        .pipe(mincss())
        .pipe(gulp.dest(build.css));
});
// Copecss
gulp.task('Copycss', function () {
    return gulp.src(src.css)
        .pipe(autoprefixer())
        .pipe(mincss())
        .pipe(gulp.dest(build.css));
});
// Copyimages
gulp.task('Copyimages', function () {
    return gulp.src(src.images)
        .pipe(imagemin({
            optimizationLevel: 5
        }))
        .pipe(gulp.dest(build.img));
})
// Copylib
gulp.task('Copylib', function () {
    return gulp.src(src.lib)
        .pipe(gulp.dest(build.lib));
});
//建立监听任务
gulp.task('watch', function () {
    gulp.watch(src.html, ['Copyhtml']).on('change', browserSync.reload);
    gulp.watch(src.less, ['Less']).on('change', browserSync.reload);
    gulp.watch(src.css, ['Copycss']).on('change', browserSync.reload);
    gulp.watch(src.images, ['Copyimages']).on('change', browserSync.reload);
    gulp.watch(src.Copylib, ['Copylib']).on('change', browserSync.reload);
});
// 先清除再编译
gulp.task('default', ['clean'], function () {
    gulp.start(['Copyhtml', 'Less', 'Copycss', 'Copyimages', 'Copylib', 'Server', 'watch'])
});
0 0