我的gulp对es6的操作不完美，来看看

问题描述

问 题

我的需求是：

1. 将分模块的es6转化为es5;(使用gulp-babel与babel-preset-es2015-node5)

2. 将转化后的es5合并成一个js文件;(使用gulp-browserify)

3. 将合并的js文件压缩混淆;(使用gulp-uglify)

我想将它们写成一步，但是不会，所以写成了下面这样：

gulp.task('es6to5',function(){
    gulp.src('./res/es6/**/*.js')
    .pipe(babel({presets:[es2015Preset]}))
    .pipe(gulp.dest('./res/js/'))
})

gulp.task('pack',function(){
    setTimeout(function(){
        gulp.src('./res/js/upLoad.js')
        .pipe(browserify())
        .pipe(gulp.dest('./res/js/temp'))
    },200)
})
gulp.task('uglify',function(){
    setTimeout(function(){
        gulp.src('./res/js/temp/upLoad.js')
        .pipe(uglify())
        .pipe(gulp.dest('./res/es5/'))
    },400)
})

甚至都不得不建立临时的文件夹。有没有好些的方案啊？

解决方案

第一步和第二步还真的合并不了，因为browserify不是那么玩的(我的意思是对流式支持没那么好)，但是你缺return导致，后面几步都要靠setTimeout维持就不专业了，我给你改改：

gulp.task('es6to5', function() {
    return gulp.src('./res/es6/**/*.js')
        .pipe(babel({presets: [es2015Preset]}))
        .pipe(gulp.dest('./res/js/'));
});

gulp.task('pack', ['es6to5'], function() {
    return gulp.src('./res/js/upLoad.js')
        .pipe(browserify())
        .pipe(uglify())
        .pipe(gulp.dest('./res/es5/'));
});

现在只要执行一个gulp pack，文件就出来了

这篇关于我的gulp对es6的操作不完美，来看看的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！