How to use the gulp.series function in gulp

'!' + path.resolve(src, '**', '*.e2e.ts'),
    '!' + path.resolve(src, '**', '*.spec.ts')
  ], { base: src })
    .pipe(sourcemap.init())
    .pipe(tsProject())
    .pipe(sourcemap.write('.'))
    .pipe(gulp.dest(dest))
})

/**
 * build
 * Builds all houston assets
 *
 * @return {stream} - A gulp task
 */
gulp.task('build', gulp.series('clean', gulp.parallel('copy', 'typescript')))

/**
 * watch
 * Builds all the houston assets, but watches for changes for faster building
 *
 * @return {void}
 */
gulp.task('watch', () => {
  const src = path.resolve(common.paths.src, '**', '*.ts')

  return gulp.watch(src, gulp.series('typescript'))
})

gulp.task('watch', (done) => {
  gulp.watch('./src/public/css/*.scss')
    .on('change', function (path) {
      gulp.src(path)
        .pipe(plumber())
        .pipe(sass())
        .pipe(gulp.dest('./build/public/css'));
      console.log('File(scss) ' + path + ' was changed');
    });

  gulp.watch(
      ['./src/**', '!./src/client/**/*', '!./src/public/css/*', '!./src/**/*.test.ts'], gulp.series('tsc', 'copy-assets'))
    .on('change', function (path) {
      console.log('File(ts) ' + path + ' was changed');
    });

  gulp.watch('./src/**/*.test.ts', gulp.series('tsc', 'test'))
    .on('change', function (path) {
      console.log('File(test) ' + path + ' was changed');
    });

  gulp.watch('./build/public/css/*.css', gulp.series('browser-reload'))
    .on('change', function (path) {
      console.log('File(css) ' + path + ' was changed');
    });

  done();
});

}


  /*--------------
        Build
  ---------------*/

  console.info('Building Semantic for docs');

  if (!install.isSetup()) {
    console.error('Cannot build files. Run "gulp install" to set-up Semantic');
    callback();
    return;
  }

  gulp.series(
    buildMetaData,
    copyExample,
    copyLess,
    (callback) => buildJS('docs', config, callback),
    (callback) => buildCSS('docs', config, {}, callback),
    (callback) => buildAssets(config, callback)
  )(callback);

};

gulp.task("watch", () => {
  return gulp.watch("./src/*", gulp.series("merge", "analyze"));
});

.pipe(rev())
    .pipe(gulp.dest(`./dist/${publicPath}`))
    .pipe(rev.manifest())
    .pipe(gulp.dest(`./dist/${publicPath}`));
}));

gulp.task('revCollector', gulp.series(() => {
  return gulp.src([
    `./dist/${publicPath}**/*.json`,
    `./dist/${publicPath}**/*.html`
  ])
    .pipe(revCollector())
    .pipe(gulp.dest(`./dist/${publicPath}`));
}));

gulp.task('cleanOriginal', gulp.series((done) => {
  const originalFiles = [];
  const manifest = require(`./dist/${publicPath}rev-manifest.json`);
  _.forEach(manifest, function (value, key) {
    originalFiles.push(`./dist/${publicPath}${key}`);
  });
  originalFiles.push(`./dist/${publicPath}rev-manifest.json`);
  del([`./dist/${publicPath}assets/scss`]);
  del(originalFiles);
  done();
}));

gulp.task('copyPublic', (done) => {
  gulp.src('./public/**/*.*')
    .pipe(gulp.dest(`./dist/${publicPath}`));
  done();
});

toplevel: true,
      output: {
        beautify: true,
        comments: false,
        ecma: 8,
        indent_level: 2,
        max_line_len: 120
      }
    }))
    .pipe(gulp.dest(terserFiles.dest));
});

const commonTasks = [ 'lint', 'clean', 'ts' ];

gulp.task('default', gulp.series(...commonTasks, 'terser'));
gulp.task('build', gulp.series(...commonTasks));

gulp.watch([
            path.join(settings.SRC_DIR, 'js', 'i18n', '*.js'),
            path.join(settings.ROOT_DIR, '../', 'vjs-*', 'src', 'js', 'i18n', '*.js'),
        ], gulp.series(code.tasks.appI18n, helpers.reload('app_i18n.js')))


        gulp.watch([
            path.join(settings.SRC_DIR, 'index.html'),
        ], gulp.series(assets.tasks.html, helpers.reload('app_fg.js')))


        gulp.watch([
            path.join(settings.SRC_DIR, 'js', 'bg', '**', '*.js'),
            path.join(settings.SRC_DIR, 'js', 'lib', '**', '*.js'),
        ], gulp.series(code.tasks.appBg, helpers.reload('app_bg.js')))


        gulp.watch([
            path.join(settings.SRC_DIR, 'components', '**', '*.js'),
            path.join(settings.SRC_DIR, 'js', 'lib', '**', '*.js'),
            path.join(settings.SRC_DIR, 'js', 'fg', '**', '*.js'),
        ], gulp.series(code.tasks.appFg, helpers.reload('app_fg.js')))

        gulp.watch([
            path.join(settings.ROOT_DIR, '../', 'vjs-*', 'src', '**', '*.js'),
        ], gulp.series(
            gulp.parallel(code.tasks.appI18n, code.tasks.appBg, code.tasks.appFg),
            code.tasks.plugins,
            helpers.reload('app_fg_plugins.js'),
        ))

.pipe(gulp.dest('web/static/fonts'));
});

/*****************
 Application tasks
 ****************/

gulp.task('app_css', gulp.series('compile:app_scss', 'minify:app_css', 'copy:app_css'));

gulp.task('app', gulp.series('app_css'));

/************
 Vendor tasks
 ************/

gulp.task('vendor_js', gulp.series('bundle:vendor_js', 'minify:vendor_js', 'copy:vendor_js'));
gulp.task('vendor_css', gulp.series('bundle:vendor_css', 'minify:vendor_css', 'copy:vendor_css'));
gulp.task('vendor_images', gulp.series('copy:vendor_images'));
gulp.task('vendor_fonts', gulp.series('copy:vendor_fonts'));

gulp.task('vendor', gulp.series('vendor_js', 'vendor_css', 'vendor_images', 'vendor_fonts'));

/************
 Install task
 ************/

gulp.task('install', gulp.series('app', 'vendor'));

/**********
 Build task
 **********/

urbitrc.URBIT_PIERS.forEach(function (pier) {
    ret = ret.pipe(gulp.dest(pier));
  });

  return ret;
});

gulp.task('tile-js-bundle-dev', gulp.series('tile-jsx-transform', 'tile-js-imports'));
gulp.task('tile-js-bundle-prod',
  gulp.series('tile-jsx-transform', 'tile-js-imports', 'tile-js-minify'));

gulp.task('bundle-prod',
  gulp.series('tile-js-bundle-prod', 'rename-tile-min', 'clean-min', 'urbit-copy'));

gulp.task('default', gulp.series('tile-js-bundle-dev', 'urbit-copy'));
gulp.task('watch', gulp.series('default', function () {
  gulp.watch('tile/**/*.js', gulp.parallel('tile-js-bundle-dev'));
  gulp.watch('../../arvo/**/*', gulp.parallel('urbit-copy'));
}));

const extractMediaQuery = require('postcss-extract-media-query');

function clean() {
    return gulp.src(path.join(__dirname, 'dist/*'))
        .pipe($.deleteFile({
            deleteMatch: true
        }));
}

function css() {
    return gulp.src(path.join(__dirname, 'src/*.css'))
        .pipe($.postcss())
        .pipe(gulp.dest(path.join(__dirname, 'dist')));
}

gulp.task('default', gulp.series(
    clean,
    css
));