gulp 自动编译

配置

import yargs from 'yargs';
const args=yargs
// 区分运行环境
.option('production',{
  boolean:true,
  default:false,
  describe:'描述'
})
.option('watch',{
  boolean:true,
  default:false,
  describe:'watch all files'
})
//日志
.option('verbose',{
  boolean:true,
  default:false,
  describe:'log'
})
//强制生成
.option('sroucemaps',{
  describe:'force the ceation of sroucemaps'
})
.option('port',{
  string:true,
  default:8080,
  describe:'server port'
})

.argv

export default args;

文件流的处理

import gulp from 'gulp';
import gulpif from 'gulp-if';
import concat from 'gulp-concat';//连接
import webpack from 'webpack';//打包工具
import gulpWebpack from 'webpack-stream';//工具流
import named from 'vinyl-named';//文件名
import livereload from 'gulp-livereload';//热更新
import plumber from 'gulp-plumber';//文件信息流
import rename from 'gulp-rename';//文件重命名
import uglify from 'gulp-uglify';//压缩文件
import {log,colors} from 'gulp-util';//命令行输出工具
import args from './util/args';//命令行参数解析
gulp.task('scripts',()=>{
  return gulp.src(['app/js/index.js'])  //打开目录
  .pipe(plumber({                        //集中处理错误
    errorHandler:function(){

    }
  }))
  .pipe(named())                    //文件重命名
  .pipe(gulpWebpack({               //文件流处理重新编译，获取模块，遇到loaders用babel
    module:{
      loaders:[{
        test:/\.js$/,
        loaders:'babel'
      }]
    }
  }),null,(err,status)=>{ //对错误的处理
    log(`Finished '${colors.cyan('scripts')}'`,stats.toString({
              chunks:false
            }))
  })
  .pipe(gulp.dest('server/public/js')) //文件存放的路径
  .pipe(rename({                       //对文件复制压缩处理
    basename:'cp',
    extname:'.min.js'
  }))
  .pipe(uglify({
    compress:{properties:false},
    output:{'quote_keys':true},
  }))
  .pipe(gulp.dest('server/public/js'))   //把压缩后的文件也放在这里
  .pipe(gulpif.watch,livereload())     //检测文件是否发生改变如果发生就进行热更新
})