gulp安装：

1. 首先确保安装了nodejs，然后执行以下命令全局安装gulp

npm install --global gulp

2. 然后进入我们的静态文件项目目录static-file，作为项目的开发依赖（devDependencies）安装：

npm install --save-dev gulp

3. 在项目根目录（static-file）下创建一个名为 gulpfile.js 的文件：

引入 必要的gulp及组件

var gulp = require('gulp'),  //gulp基础库
    minifycss = require('gulp-minify-css'),   //css压缩
    concat = require('gulp-concat'),   //合并文件
    uglify = require('gulp-uglify'),   //js压缩
    rename = require('gulp-rename'),   //文件重命名
    jshint = require('gulp-jshint'),   //js检查
    notify = require('gulp-notify');   //提示
    clean = require('gulp-clean');

创建任务

//css压缩处理
gulp.task('minifycss',function(){
   return gulp.src('/Users/fantingsheng/static-file/css/slightech.css')      //设置css
       .pipe(concat('slightech'+myDate+'.css'))      //合并css文件到"order_query"
       .pipe(gulp.dest('dist/css'))           //设置输出路径
       .pipe(clean())
       .pipe(rename({suffix:'.min'}))         //修改文件名
       .pipe(minifycss())                    //压缩文件
       .pipe(gulp.dest('dist/css'))            //输出文件目录
       .pipe(notify({message:'css task ok'}));   //提示成功
});

//JS处理
gulp.task('minifyjs',function(){
   return gulp.src([
      '/Users/fantingsheng/static-file/js/slightech.js',
    ])  //选择合并的JS
       .pipe(concat('slightech'+myDate+'.js'))   //合并js
       .pipe(gulp.dest('dist/js'))         //输出
       .pipe(clean())
       .pipe(rename({suffix:'.min'}))     //重命名
       .pipe(uglify())                    //压缩
       .pipe(gulp.dest('dist/js'))            //输出 
       .pipe(notify({message:"js task ok"}));    //提示
});

//合并js文件
gulp.task('scripts-concat',function(){
  gulp.src([
    '/Users/fantingsheng/static-file/js/bootstrap-carousel.min.js', 
    '/Users/fantingsheng/static-file/js/bootstrap-transition.min.js',
    '/Users/fantingsheng/static-file/js/bootstrap-collapse.min.js',
    '/Users/fantingsheng/static-file/js/bootstrap-dropdown.min.js',
    '/Users/fantingsheng/static-file/js/bootstrap-modal.min.js',
    '/Users/fantingsheng/static-file/js/bootstrap-tab.min.js'
  ])
    .pipe(concat('bootstrap.min.js'))
    .pipe(clean())
    .pipe(gulp.dest('dist/js'))
    .pipe(notify({message:'concat task ok'}));   //提示成功
}); 

//合并css文件
gulp.task('styles-concat',function(){
  gulp.src([
    '/Users/fantingsheng/static-file/css/bootstrap.min.css', 
    '/Users/fantingsheng/static-file/css/bootstrap-responsive.min.css'
  ])
    .pipe(concat('slightech-base.min.js'))
    .pipe(clean())
    .pipe(gulp.dest('dist/css'))
    .pipe(notify({message:'concat task ok'}));   //提示成功
}); 

添加需要执行的任务

gulp.task('default',function(){
    gulp.start('minifycss','minifyjs','scripts-concat');
);

在项目跟目录下执行命令

gulp