Question

我希望按$(document).ready(function() { device = scanDevice(); reorderColumns(device); }); var reorderColumns = function(device) { $('*[data-toggle="orderColumns"]').each(function() { var ctx = $(this), columnsToOrder = ctx.attr('data-target'), columns = ctx.find(columnsToOrder), newOrder = [], orderId; $(columns).each(function() { orderId = $(this).attr('data-'+device+'-orderid'); if(typeof orderId != 'undefined'){ var elementObj = { id: orderId, html: $(this).html() } newOrder.push(elementObj); } }) if(newOrder.length){ $(newOrder).each(function(key,value){ ctx.find('*[data-position="'+ value.id +'"]').html(value.html); }) } }); } var scanDevice = function() { var windowWdth = $(window).width(); var device = 'lg'; if(windowWdth < 768){ device = 'xs'; } else if(windowWdth >= 768 && windowWdth < 992) { device = 'sm'; } else if(windowWdth >= 992 && windowWdth < 1200){ device = 'md'; } return device; }编译sass，然后uglify gulp进行制作。试用时

css

我在控制台中有以下报告：

gulp.task('build', ['sass', 'min-css'], function(){

    // ...

});

如您所见，[16:44:06] Starting 'sass'... [16:44:06] Starting 'min-css'... [16:44:22] Finished 'sass' after 16 s [16:44:22] Finished 'min-css' after 16 s [16:44:22] Starting 'build'... [16:44:22] Finished 'build' after 6.2 ms任务在min-css任务结束之前启动。虽然没有任何错误，但此任务序列不正确。我需要在sass开始之前完成sass。

Answer 1

gulp docs：＆＃34;注意：任务将并行运行（一次性完成），因此不要假设任务将按顺序开始/结束。＆＃34;这就是为什么你的min-css任务可以在sass任务之前开始或完成的原因。

有两种主要方法可以解决这个问题。

（1）制作＆＃39; min-css＆＃39;任务取决于＆＃39; sass＆＃39;任务。像

这样的东西

// identifies a dependent task must be complete before this one begins

gulp.task('min-css', ['sass'], function() {
    // task 'sass' is done now
});

（2）使用专为此问题设计的插件 run-sequence

按指定顺序运行一系列gulp任务。此函数旨在解决已定义运行顺序的情况，但选择不使用或不使用依赖关系。

（3）您也可以尝试使用gulp.series和gulp.parallel函数的gulp4.0来简化这些操作。 Gulp4在技术上处于测试阶段。

gulp：顺序任务执行

1 个答案: