【gulp】gulp@4.0.0にしたら`The following tasks did not complete:`、`Did you forget to signal async completion?`と怒られる

はじめに

とあることで、gulpを3.x.x.から^4.0.0にあげる必要がありました。
f:id:tweeeety:20180618044056p:plain

あげてからgulpタスクを実行すると
以下のようなエラーが出たのでその対応方法をメモ

# defaultタスクを実行するとこんなエラーが...
$ ./node_modules/gulp/bin/gulp.js
[05:35:32] Using gulpfile ~/gulp-task-gulp4.0.0-sample2/gulpfile.js
[05:35:32] Starting 'default'...
[05:35:32] Starting 'hoge'...
i am hoge!!
[05:35:32] The following tasks did not complete: default, hoge
[05:35:32] Did you forget to signal async completion?

なぜ起こったか

The following tasks did not complete 　
上記の実行時のログより

処理が終わってないよと言われてます。

4.x.xではgulpタスクで以下のことを行う必要があります

明示的にtaskを終了する

callbackを呼び出す

streamを返却する

単にreturnをつける

どうすればいいか

すでに書いてしまってますが、
明示的にtaskを終了をする必要があります。

gulp.task@3.x.x -> gulp.task@^4.x.x
に書き換える変える一例をあげます。

gulp.task@3.x.x

gulp.task('sass', function(){
  gulp.src('./sass/*.scss')
    .pipe(sass({outputStyle: 'expanded'}))
    .pipe(gulp.dest('./css/'));
});

gulp.task@^4.x.x

gulp.task('sass', function(){
  // streamをreturnする
  return gulp.src('./sass/*.scss')
    .pipe(sass({outputStyle: 'expanded'}))
    .pipe(gulp.dest('./css/'));
});