gulp 4.0爬坑指南

很久时间没有用gulp，最近公司有个项目需要优化，使用了gulp处理多文件流，才发现4.0还有这么多的坑，和旧版比非常不习惯。不多说了，看来还得去刷一遍api。

1、gulp.src里使用数组会导致遍历不全问题。

gulp.src(['./*-en-us','./*-zh-hans','./*-zh-tw'])  //导致遍历不全

//拆分才能遍历完全
gulp.src('./*-en-us')
gulp.src('./*-zh-hans')
gulp.src('./*-zh-tw')

2、task写法完全改变

旧版

gulp.task('clean',function(){
    ...
})

新版

function clean(cb) {
  cb();
}
//两种写法return或ch()回调
function javascript() {
  return  gulp.src(path.join('./*-'+fildNmae))
}

3、watch监听写法已改变

旧版监听

gulp.task('watch',function(){
    gulp.watch('./stylesheets/**/*.scss',['sass','css']);
})

4.0版本监听

const { watch, series } = require('gulp');
function clean(cb) {
  cb();
}
//两种写法return或ch()回调
function javascript() {
  return  gulp.src(path.join('./*-'+fildNmae))
}
// 可以只关联一个任务
watch('src/*.js', javascript);
// 或者关联一个任务组合
watch('src/*.js', series(clean, javascript));

新版传参

function copy(fildNmae) {
  return gulp.src(path.join('./*-'+fildNmae))
}
gulp.watch('./src/**/*', { events: 'change' },function(cb){
    copy('zh-hans');
    copy('en-us');
    copy('zh-tw');
    cb();
  })