Как сделать что бы webpack dev server перезапускался при добавлении новых файлов?

Question

[Егор Астрейко]

Всем привет, как сделать, что бы при добавлении нового файла (.pug) в проект, webpack dev server перезапускался и эта страница была доступна в браузере, а при удалении файлов не выскакивала ошибка о том, что он не может найти файл, который был удален ?

const LiveReloadPlugin = require('webpack-livereload-plugin');
const path = require('path');
const fs = require('fs');
const PATHS = {
	src: path.resolve(__dirname, 'src'),
	dist: path.resolve(__dirname, 'dist'),
}

const PAGES_DIR = `${PATHS.src}/page/`
const PAGES = fs.readdirSync(PAGES_DIR).filter(fileName => fileName.endsWith('.pug'));

const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
	entry: {
		libs: [`${PATHS.src}/js/libs/index.js`],
		common: [`${PATHS.src}/js/index.js`],
		main: [`${PATHS.src}/sass/main.scss`]
	},
	output: {
		path: `${PATHS.dist}`,
		filename: 'js/[name].js',

	},
	plugins: [
		...PAGES.map(page => new HtmlWebpackPlugin({
			template: `${PAGES_DIR}/${page}`,
			filename: `${page.replace(/\.pug/,'.html')}`,
			inject: false
		})),
		new MiniCssExtractPlugin({
			// Options similar to the same options in webpackOptions.output
			// all options are optional
			filename: 'css/[name].css',
			ignoreOrder: false, // Enable to remove warnings about conflicting order
		}),
		new LiveReloadPlugin({
			appendScriptTag: true
		})
	],
	module: {
		rules: [{
				test: /\.js$/i,
				exclude: /node_modules/,
				use: {
					loader: 'babel-loader',
					options: {
						presets: ['@babel/preset-env']
					}
				}
			},
			{
				test: /\.pug$/i,
				loaders: [{
						loader: "html-loader"
					},
					{
						loader: "pug-html-loader",
						options: {
							"pretty": true,
							"doctype": ""
						}
					}
				]
			},
			{
				test: /\.s[ac]ss$/i,
				use: [
					MiniCssExtractPlugin.loader,
					'css-loader',
					{
						loader: "postcss-loader",
						options: {
							config: {
								path: "postcss.config.js"
							}
						}
					},
					'sass-loader'
				],
			},
			{
				test: /\.(woff(2)?|ttf|eot|svg)(\?v=\d+\.\d+\.\d+)?$/,
				use: [{
					loader: 'file-loader',
					options: {
						name: '[name].[ext]',
						outputPath: 'fonts/'
					}
				}]
			}
		]
	},
	devServer: {
		contentBase: "./src/",
		compress: true,
		watchContentBase: true,
		inline: true,
		historyApiFallback: true,
		disableHostCheck: true,
		stats: {
			colors: true,
			modules: false,
			chunks: false,
			chunkGroups: false,
			chunkModules: false,
			env: true,
		},
		port: 9000
	}
};

Заранее спасибо.