gulp配置

gulfile.js：

var gulp = require("gulp");
var cssnano = require("gulp-cssnano");
var rename = require("gulp-rename");
var uglify = require("gulp-uglify");
var concat = require("gulp-concat");
var cache = require("gulp-cache");
var imagemin = require("gulp-imagemin");
var bs = require("browser-sync").create();


var path = {
    'html' : './templates/**/',
    'css': './src/css/',
    'js' : './src/js/',
    'images' : './src/images/',
    'css_dist' : './dist/css/',
    'images_dist' : './dist/images/',
    'js_dist' : './dist/js',
};

//处理html文件
gulp.task("html",function () {
        gulp.src(path.html + '*.html')
        .pipe(bs.stream())
});

gulp.task("css",function(){
    gulp.src(path.css + '*.css')
        .pipe(cssnano())
        .pipe(rename({"suffix":".min"}))
        .pipe(gulp.dest(path.css_dist))
        .pipe(bs.stream())
});

gulp.task('js',function(){
    gulp.src(path.js + '*.js')
        .pipe(uglify())
        .pipe(gulp.dest(path.js_dist))
        .pipe(bs.stream())
});

gulp.task('images',function(){
    gulp.src(path.images + '*.*')
        .pipe(cache.images + '*.*')
        .pipe(gulp.dest(path.images_dist))
        .pipe(bs.stream())
});

//定义监听文件修改的任务
gulp.task('watch',function () {
    gulp.watch(path.html + "*,html",['html']);
    gulp.watch(path.css + "*,css",['css']);
    gulp.watch(path.js + '*.js',['js']);
    gulp.watch(path.images + '*.*',['images']);
});

gulp.task("bs",function(){
    bs.init({
        'server':{
            'baseDir':'./'
        }
    });
});

gulp.task('default',['bs','watch']);

运行 gulp css 压缩文件

 

执行gulp 运行程序