docker-composeを使いつつgulpでブラウザを自動更新する

作業ディレクトリ             
├── gulpfile.js
├── htdocs ・・・「localhost:8080」で見るディレクトリ
├── node_modules
├── package.json
├── src　・・・作業ファイルを入れるディレクトリ。gulpで更新後のファイルをhtdocsに入れる。
└── yarn.lock

version: '3'

services:
  apache:
    image: php:7-apache
    volumes:
      - $PWD:/var/www/html
    ports:
      - 8080:80

const gulp = require('gulp');
const watch = require('gulp-watch');
const browserSync = require('browser-sync').create();
const runSequence = require('gulp4-run-sequence');
const DEST_DIR = './htdocs/';

gulp.task('browser-sync', function(){
    browserSync.init({
    proxy: 'localhost:8080' // ←docker-composeで指定したport
    });
});

gulp.task('bs-reload', function(){
    browserSync.reload();
});

gulp.task('hoge', function() {
    return gulp.src(['src/hogehoge/**/*.hoge'])
    .pipe(gulp.dest(DEST_DIR))
});

gulp.task('default', gulp.series(
  gulp.parallel('browser-sync', 'hoge', function() {
    watch([/*作業対象のファイル*/], function() {
        return runSequence(
            'hoge',
            'bs-reload'
        );
    });
  })
));