Question

我正在尝试将项目的构建过程更新为Gulp 4，因此当每个人的计算机都运行Node v12 +时，我们不会遇到问题。我遇到了一个问题，其中部分构建过程将React代码捆绑为4个版本（每种用户类型一个），然后挂起，而不是继续进行本系列中的下一个任务。

本质上，此任务返回一个browserify捆绑包的映射，但我认为Gulp 4希望每次返回都是某种函数或其内置的done（）调用。

我曾尝试在返回任务数组之前调用done（）函数，但是在实际构建任务之前，它似乎跳出了函数。

我的下一个尝试是将这四个捆绑包分解成各自的任务，但是我想看看是否有一种方法可以挽救已经使用的模式。

gulp.task('js:react', function (done) {

    const bundleSettings = [
        {
            name: 'anon',
            context : {
                ANON: true,
                USER: false,
                PREMIUM: false,
                ADMIN: false
            }
        },
        {
            name: 'user',
            context : {
                ANON: false,
                USER: true,
                PREMIUM: false,
                ADMIN: false
            }
        },
        {
            name: 'premium',
            context : {
                ANON: false,
                USER: true,
                PREMIUM: true,
                ADMIN: false
            }
        },
        {
            name: 'admin',
            context : {
                ANON: false,
                USER: true,
                PREMIUM: true,
                ADMIN: true
            }
        }
    ];

    const tasks = bundleSettings.map(function (bundleSetting) {
        var bundler = browserify({
            entries: [SOURCES_ROOT + '/scripts-src/react/main.jsx'],
            cache: {},
            packageCache: {},
            bundleExternal: false
        });

        bundler.external(VENDOR_EXTERNALS);

        bundler.plugin(watchify);

        bundler.transform(babelify, {
            global: true,
            compact: true,
            minified: true,
            comments: false,
            presets: ['react', 'es2015']
        });

        bundler.transform(preprocessify, {
            context: bundleSetting.context
        });

        function rebundle () {
            var stream = bundler.bundle()
                .on('error', handleErrors)
                .pipe(source('react-'+ bundleSetting.name +'.js'));
            applyUglification(stream)
                .pipe(gulp.dest(STATIC_ROOT + '/scripts/compiled'));
            if (browserSync) {
                stream.pipe(browserSync.stream());
            }
            return stream;
        }

        bundler.on('update', rebundle);

        bundler.on('time', bundleComplete);

        return rebundle();
    });

    return tasks;
});


gulp.task('build', gulp.series('sass', 'js:vendor', 'js:lib', 'js:react', 'js:charts'));

gulp.task('set_to_prod', function (done) {
    process.env.NODE_ENV = 'production';
    done();
});

gulp.task('assemble', gulp.series('set_to_prod', 'build', (done) => {
    //kill the process here once all of the steps are finished
    done();
    process.exit(0);
}));

我希望先构建四个用户类型的捆绑包，然后再继续执行“ gulp-assemble”任务的下一步，但该应用程序会无限期地挂在“ js：react”步骤上。

在Gulp 4任务中是否有返回数组的正确方法？

0 个答案: