gulp配置文件

通过 npm install --save-dev gulp这种形式安装所有组件，会自动在package.json内devDependencies中生成版本信息。
保留package.json文件，换机子使用时可以直接通过npm install 来一次性安装所有devDependencies内所有依赖

• gulpfile.js

    // 引入各种组件
    var gulp                    = require('gulp'),                  //gulp
        
        uglify                  = require('gulp-uglify'),           //js压缩
        
        minifyCss               = require('gulp-minify-css'),       //css压缩
        
        autoprefixer            = require('gulp-autoprefixer'),     //自动补全前缀
        
        htmlmin                 = require('gulp-htmlmin'),          //压缩html
        
        less                    = require('gulp-less'),             //less编译
        
        imagemin                = require('gulp-imagemin'),         //图片压缩
        
        imageminJpegRecompress  = require('imagemin-jpeg-recompress'),
        
        imageminOptipng         = require('imagemin-optipng'),
        
        browserSync             = require('browser-sync').create();  //浏览器自动刷新
    
    // 设置输入输出文件夹
    var devJs       = 'dev/script/*.js',                //js
        
        distJs      = 'dist/script',
        
        devCss      = 'dev/css/*.css',
    
        distCss     ='dist/css',
        
        devLess     = 'dev/css/*.less',                 //less
        
        distLess    = 'dist/css',
        
        devImg      = 'dev/img/*.*',                    //img
        
        distImg     = 'dist/img',
        
        devTplHtml  = 'dev/tpl/*.html',                 //模板文件html
        
        distTplHtml = 'dist/tpl',
        
        devTplJs    = 'dev/tpl/*.js',                   //控制器文件js
        
        distTplJs   = 'dist/tpl/*.js',
        
        devLib      = 'dev/lib/**/*.*',                 //引用框架*
        
        distLib     = 'dist/lib';
    
    //task配置
    
    //js压缩,使用gulp jsmin启动
    gulp.task('jsmin',function(){
        gulp.src(devJs)
            .pipe(uglify())
            .pipe(gulp.dest(distJs));
    });
    
    //less编译
    gulp.task('less',function(){
        gulp.src(devLess)
            .pipe(less({
                outputStyle:'compressed'
            }))
            .pipe(gulp.dest(distLess));
    });
    
    //css压缩
    gulp.task('minifyCss',function(){
        gulp.src(devCss)
            .pipe(minifyCss())
            .pipe(gulp.dest(distCss))
    });
    
    //图片压缩任务，支持JPEG、PNG、及GIF文件;
    gulp.task('imgmin',function(){
        var jpgmin = imageminJpegRecompress({
            accurate:true,//高精度模式
            quality:"high",//图像质量:low,medium,high and veryhigh
            method:"smallfry",//网络优化:mpe,ssim,ms-min and smallfry
            min:70,//最低质量
            loops:0,//循环尝试次数，默认为6
            progressive:false,//基线优化
            subsmaple:"default"//子采样:default,disable
        }),
            pngmin = imageminOptipng({
                optimizationLevel:4
            });
        gulp.src(devImg)
            .pipe(imagemin({
                use:[jpgmin,pngmin]
            }))
            .pipe(gulp.dest(distImg))
    });
    
    //模板文件（html和js压缩）
    gulp.task('tplmin',function(){
        gulp.src(devTplHtml)
            .pipe(htmlmin())
            .pipe(gulp.dest(distTplHtml));
        gulp.src(devTplJs)
            .pipe(uglify())
            .pipe(gulp.dest(distTplJs));
    });
    
    //lib迁移
    gulp.task('copyLib',function(){
        gulp.src(devLib)
            .pipe(gulp.dest(distLib));
    });
    
    //服务器任务，以根目录为入口
    gulp.task('server',function(){
        browserSync.init({
            server:"./"
        });
    });
    
    //监控改动并自动刷新
    gulp.task('auto',function(){
        gulp.watch(devJs,['jsmin']);
        gulp.watch(devLess,['less']);
        gulp.watch(devCss,['minifyCss']);
        gulp.watch(devTplHtml,['tplmin']);
        gulp.watch(devImg,['imgmin']);
        gulp.watch(devLib,['copyLib']);
        gulp.watch(['dev']).on('change',browserSync.reload);
    });
    
    gulp.task('default',['jsmin','less','minifyCss','imgmin','tplmin','copyLib','server','auto']);
  

• package.json

 {
  "name": "vue",
  "version": "1.0.0",
  "description": "",
  "main": "gulpfile.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/865077695/vue.git"
  },
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/865077695/vue/issues"
  },
  "homepage": "https://github.com/865077695/vue#readme",
  "devDependencies": {
    "browser-sync": "^2.18.8",
    "gulp": "^3.9.1",
    "gulp-autoprefixer": "^3.1.1",
    "gulp-htmlmin": "^3.0.0",
    "gulp-imagemin": "^3.2.0",
    "gulp-less": "^3.3.0",
    "gulp-minify-css": "^1.2.4",
    "gulp-uglify": "^2.1.2",
    "imagemin": "^5.2.2",
    "imagemin-jpeg-recompress": "^5.1.0",
    "imagemin-optipng": "^5.2.1"
  }
}