运行gulp任务,提示信息:Did you forget to signal async completion
作者:互联网
问题背景
自学是痛苦的一件事,最近自学gulp的前端自动化构建,按照示例代码,对本地CSS代码进行压缩,源代码如下:
gulpfile.js 文件:
// less 语法转换 // css 代码压缩 gulp.task('cssmin', () => { gulp.src(['./src/css/*.less', './src/css/*.css']) .pipe(less()) .pipe(csso()) .pipe(gulp.dest('dist/css')); });提示信息如下:
[01:46:43] The following tasks did not complete: cssmin [01:46:43] Did you forget to signal async completion?
翻译过来,也就是:
以下任务没有完成:cssmin 你忘记发送异步完成信号了吗?
截图如下:
虽然冒红报错了,但是并不影响执行.....但是抱着 解决问题的心态,我还是查阅了大量资料。
解决办法
查阅资料后,有很多解决办法,但从根本看,应该还是 gulp 版本的问题, gulp 4- 版本 相对于gulp 3- 版本, 更加规范化。
这里只列举两个常用的解决办法。
解决方法一:
加 return 返回。因为task()方法 参数是回调函数,回调函数就应该有个 return 返回。
这应该就是为什么 gulp 3- 不加return不报错,但是 gulp 4- 版本报错的原因,因为更加规范化。
gulp.task('cssmin', () => { return gulp.src(['./src/css/*.less', './src/css/*.css']) .pipe(less()) .pipe(csso()) .pipe(gulp.dest('dist/css')); });
解决方法二:
说是官方提供方法。但是我确实没查到在哪规范的。
在不使用文件流的情况下,向task的函数里传入一个名叫done的回调函数,以结束task(),如下代码所示:
gulp.task('cssmin', done => { gulp.src(['./src/css/*.less', './src/css/*.css']) .pipe(less()) .pipe(csso()) .pipe(gulp.dest('dist/css'));
done(); });
可能有人就会问,既然第一种方法,那么方便,为什么还要说第二种方法,因为在自学的 过程中,我还遇到其他问题。如下:
我在task 中,写了两个gulp.src 拷贝处理任务,如果用 return,我该返回哪个?我在不知道怎么写的的情况下,就直接采用了 方法二,顺利解决。
// 网站其他文件拷贝 gulp.task('copy', done => { gulp.src('./src/images/*') .pipe(gulp.dest('dist/images')); gulp.src('./src/lib/*') .pipe(gulp.dest('dist/lib')); done(); });
done回调函数的作用是在task完成时通知gulp(而不是返回一个流)
by不言谢
标签:completion,src,task,forget,less,gulp,提示信息,pipe,css 来源: https://www.cnblogs.com/byx1024/p/14418921.html