When I run webpack with webpack serve --mode=development --config webpack.config.js
, it runs OK.
However, when stopping it, I get a message that says:
<i> [webpack-dev-server] Gracefully shutting down. To force exit, press ^C again. Please wait...
Pressing control-C any amount of times does nothing. The only way for me to kill this process is to (very ungracefully) kill my entire terminal.
Does anyone have any idea as to what the issue might be, or how to get Webpack to close down normally?
I'll include my webpack.config.js here:
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const appDirectory = path.resolve(__dirname);
const {presets} = require(`./babel.config.js`);
const compileModules = [
...
].map((moduleName) => path.resolve(appDirectory, `../../packages/${moduleName}`));
const compileRootModules = [
...
].map((moduleName) => path.resolve(appDirectory, '..', '..', `node_modules/${moduleName}`));
const babelLoaderConfiguration = {
test: /\.js$|tsx?$/,
include: [
path.resolve(__dirname, 'index.tsx'),
path.resolve(__dirname, 'src'),
...compileModules,
...compileRootModules,
],
use: {
loader: 'babel-loader',
options: {
cacheDirectory: true,
presets,
plugins: ['react-native-web'],
},
},
};
const svgLoaderConfiguration = {
test: /\.svg$/,
use: [
{
loader: '@svgr/webpack',
},
],
};
const imageLoaderConfiguration = {
test: /\.(gif|jpe?g|png)$/,
use: {
loader: 'url-loader',
options: {
name: '[name].[ext]',
},
},
};
const cssLoaderConfiguration = {
test: /\.css$/i,
use: ['style-loader', 'css-loader', 'sass-loader'],
};
// eslint-disable-next-line import/no-commonjs
module.exports = {
devtool: 'source-map',
devServer: {
historyApiFallback: true,
hot: true,
},
entry: {
app: path.join(__dirname, 'index.tsx'),
},
output: {
path: path.resolve(appDirectory, 'dist'),
publicPath: '/',
filename: 'foo_app.[hash:8].bundle.js',
},
resolve: {
extensions: ['.web.tsx', '.web.ts', '.tsx', '.ts', '.web.js', '.js'],
alias: {
'react-native$': 'react-native-web',
},
},
module: {
rules: [
babelLoaderConfiguration,
imageLoaderConfiguration,
svgLoaderConfiguration,
cssLoaderConfiguration,
],
},
plugins: [
new HtmlWebpackPlugin({
template: path.join(__dirname, 'index.html'),
}),
new webpack.DefinePlugin({
__DEV__: JSON.stringify(true),
}),
],
};
My first guess at this, is that perhaps a long-running Babel script of some sort is holding up Webpack from closing timeously. However, any direction in solving this is appreciated. TIA