Gulpのconfigファイル

// プラグインを定義
const gulp = require("gulp");
const sass = require("gulp-sass");
const autoprefixer = require("gulp-autoprefixer");
const plumber = require("gulp-plumber");
const cleancss = require ("gulp-clean-css");
const sourcemaps = require('gulp-sourcemaps');
const connect = require('gulp-connect-php');

const webpackstream = require("webpack-stream");
const webpack = require("webpack");

// webpack setting
const webpackConfig = require("./webpack.config");

// sassファイルのコンパイルの処理
gulp.task('sass', done => {
    gulp.src("src/scss/**/*.scss")
        .pipe(plumber())
        .pipe(sourcemaps.init())
        .pipe(sass())
        .pipe(autoprefixer())
        .pipe(cleancss())
        .pipe(sourcemaps.write('./'))
        .pipe(gulp.dest("./dist"))
		done()
});

// jsファイルのコンパイルの処理
gulp.task("js", done => {
    return webpackstream(webpackConfig, webpack)
    .on('error', function handleError() {
        this.emit('end'); // Recover from errors
    })
    .pipe(gulp.dest("./dist"))
    done()
});

// ローカルサーバーを定義
gulp.task('connect', done => {
    connect.server({
		port:8001,
	});
	done()
});

// 監視対象を定義
gulp.task('watch', () => {
	gulp.watch('src/scss/**/*.scss', gulp.series('sass','logSass'))
	gulp.watch('src/js/**/*.js', gulp.series('js','logJs'));
});

// sassのエラーを検出するための定義
gulp.task('logSass', done => {
	console.log("sass was successful.")
	done()
});

// jsのエラーを検出するための定義
gulp.task('logJs', done => {
	console.log("javascript was successful.")
	done()
});

gulp.task("default",gulp.series(gulp.parallel('watch','connect')));