Gulp任务编程运行：深入解析async与流处理的冲突及解决方案

//Inline CSS from app.css into compiled HTML files
gulp.task('inline', async function () {
    return gulp
        .src('dist/inline-html/*.html')
        .pipe(inlineCSS())
        .pipe(gulp.dest('dist/send-html'));
});

//Inline CSS from app.css into compiled HTML files
gulp.task('inline', function () { // 移除 async 关键字
    return gulp
        .src('dist/inline-html/*.html')
        .pipe(inlineCSS())
        .pipe(gulp.dest('dist/send-html'));
});

gulp.task('inline', function () {
    return new Promise((resolve, reject) => {
        gulp.src('dist/inline-html/*.html')
            .pipe(inlineCSS())
            .pipe(gulp.dest('dist/send-html'))
            .on('end', resolve) // 确保在流结束时解决Promise
            .on('error', reject); // 确保在流出错时拒绝Promise
    });
});

const gulp = require('gulp');
const rename = require('gulp-rename');
const inlineCSS = require('gulp-inline-css');
const clean = require('gulp-clean');
const panini = require('panini');

// 编译Handlebars模板
gulp.task('handlebars', function () { // 保持或移除 async 取决于内部是否有 await
    return gulp
        .src('views/pages/*.hbs')
        .pipe(
            panini({
                root: 'views/pages',
                layouts: 'views/layouts',
                partials: 'views/partials',
            })
        )
        .pipe(
            rename(function (path) {
                path.basename += '-send';
                path.extname = '.html';
            })
        )
        .pipe(gulp.dest('dist/inline-html'));
});

// 将CSS内联到编译后的HTML文件中
gulp.task('inline', function () { // 关键修正：移除 async 关键字
    return gulp
        .src('dist/inline-html/*.html')
        .pipe(inlineCSS())
        .pipe(gulp.dest('dist/send-html'));
});

// 清理dist文件夹
gulp.task('clean', function () { // 保持或移除 async 取决于内部是否有 await
    return gulp.src('dist/**/*', { read: false }).pipe(clean());
});

/**
 * 编程方式运行Gulp任务序列
 * @returns {Promise<void>}
 */
async function gulpTaskRunner() {
    return new Promise(function (resolve, reject) {
        // 使用 gulp.series 运行任务序列
        // 最后一个参数是一个回调函数，当所有任务完成后会被调用
        gulp.series('clean', 'handlebars', 'inline', (err) => {
            if (err) {
                console.error('Gulp task sequence failed:', err);
                return reject(err);
            }
            console.log('Gulp task sequence completed successfully');
            resolve();
        })(); // 注意：需要立即调用 gulp.series 返回的函数
    });
}

/**
 * 主应用程序逻辑
 */
async function app() {
    console.log('Application start');
    try {
        await gulpTaskRunner();
        console.log('All Gulp tasks finished successfully.');
    } catch (error) {
        console.error('Application encountered an error during Gulp tasks:', error);
    }
    console.log('Application end');
}

// 启动应用程序
app();