Сборка Webpack4 Dev зависла

Я пытаюсь перенести свое приложение с Webpack3 на Webpack4. Я столкнулся с проблемой в dev build. он не выдает никакой ошибки. его просто повесили. Пожалуйста, найдите ниже мою конфигурацию webpack dev. Изменение, которое я недавно добавил, это 1. Удален плагин extract-text-webpack-plugin, 2.optimization.splitChunks добавлен вместо CommonsChunkPlugin 3. используется mini-css-extract-plugin вместо Extract- текст-webpack-плагин.

const path = require('path');
const paths = require('./paths');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
// const ExtractTextPlugin = require('extract-text-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CopyWebpackPlugin = require('copy-webpack-plugin');
process.env.NODE_ENV = 'development';
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

const data = {
    devtool: 'source-map',
    context: paths.context,
    mode: 'development',
    entry: [
        'react-hot-loader/patch',
        'webpack-dev-server/client?http://0.0.0.0:3030',
        'webpack/hot/only-dev-server',
        paths.appIndexJs
    ],
    output: {
        path: '/',
        filename: 'static/js/[name].bundle.js',
        publicPath: '/',
        jsonpFunction: 'myfunction'
    },
    optimization: {
        namedModules: true,
        splitChunks: {
            cacheGroups: {
                commons: { test: /[\\/]node_modules[\\/]/, name: "vendors", chunks: "all" }
            }
        },
        noEmitOnErrors: true,
        concatenateModules: true 
    },
    module: {
        rules: [
            {
                test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$/,
                use: [
                    {
                        loader: 'file-loader',
                        options: {
                            name: 'static/images/[name].[ext]'
                        }
                    }
                ]
            },
            {
                test: /\.js$/,
                exclude: [/node_modules/],
                use: [
                    {
                        loader: 'babel-loader',
                        options: {
                            presets: [
                                [
                                    'latest',
                                    {
                                        es2015: {
                                            modules: false
                                        }
                                    }
                                ],
                                'react',
                                'react-hmre'
                            ],
                            plugins: [
                                'transform-class-properties',
                                ['transform-object-rest-spread', { useBuiltIns: true }],
                                // Polyfills the runtime needed for async/await and generatorss
                                [
                                    'transform-runtime',
                                    {
                                        helpers: false,
                                        polyfill: false,
                                        regenerator: true,
                                        moduleName: path.dirname(require.resolve('babel-runtime/package'))
                                    }
                                ],
                                [
                                    'transform-regenerator',
                                    {
                                        // Async functions are converted to generators by babel-preset-latest
                                        async: false
                                    }
                                ]
                            ]
                        }
                    }
                ]
            },
            {
                test: /\.css$/,
                exclude: [/node_modules/],
                use: [
                    MiniCssExtractPlugin.loader,
                    {
                        loader: "css-loader",
                        options: {
                            modules: true,
                            localIdentName: '[name]__[local]',
                            importLoader: 1
                        }
                    },
                    {
                        loader: `postcss-loader`,
                        options: {
                            options: {},
                        }
                    }
                    // { loader: 'postcss-loader', options: { config: { path: 'config/postcss.config.js' } } }
                ]
            },
            {
                test: /\.css$/,
                exclude: [/src/],
                include: [/node_modules/],
                use: [
                    MiniCssExtractPlugin.loader,
                    "css-loader"
                ]
            },
            {
                test: /\.scss$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    'css-loader',
                    'sass-loader'
                ]
            }
        ]
    },
    plugins: [
        new webpack.DefinePlugin({
            'process.env.NODE_ENV': '"development"',
            __IMAGE_PATH__: '""',
            __ENV__: '"development"'
        }),
        new webpack.LoaderOptionsPlugin({
            options: {
                postcss: [
                    require('postcss-import')({
                        path: process.cwd() + '/src/styles/',
                        addDependencyTo: webpack
                    }),
                    require('postcss-modules-resolve-from-alias')({
                        css: process.cwd() + '/src/styles'
                    }),

                    require('postcss-mixins'),
                    require('postcss-nested'),
                    require('postcss-cssnext')
                ]
            }
        }),
        new webpack.NamedModulesPlugin(),
        new webpack.HotModuleReplacementPlugin(),
        // new ExtractTextPlugin({ filename: 'static/css/main.css', allChunks: true }),
        new MiniCssExtractPlugin({
            filename: 'static/css/main.[chunkhash:8].css',
            chunkFilename: "[name].css"
        }),
        new CopyWebpackPlugin([{ from: '../src/styles/images', to: 'static/images' }]),
        new CopyWebpackPlugin([{ from: '../public/images', to: 'static/images' }]),
        new webpack.ContextReplacementPlugin(/moment[\\\/]locale$/, /^\.\/(en)$/),
        // Generates an `index.html` file with the <script> injected.
        new HtmlWebpackPlugin({
            inject: true,
            template: paths.appHtml,
            basePath: ''
        }),
        new BundleAnalyzerPlugin()
    ],
    resolve: {
        modules: [paths.context, paths.context + '/styles/', 'node_modules']
    },
    devServer: {
        contentBase: paths.context,
        port: 3030,
        hot: true,
        inline: false,
        historyApiFallback: true
    }
};
module.exports = data;

Пожалуйста, найдите ниже детали в терминале

$ npm run start:dev

> [email protected] start:dev 
> webpack-dev-server --config config/webpack.config.dev.js
ℹ ｢wds｣: Project is running at http://localhost:3030/webpack-dev-server/
ℹ ｢wds｣: 404s will fallback to /index.html
(node:50691) DeprecationWarning: loaderUtils.parseQuery() received a non-string value which can be problematic, see https://github.com/webpack/loader-utils/issues/56
parseQuery() will be replaced with getOptions() in the next major version of loader-utils.

его повесили. После этого никакого процесса. Пожалуйста, помогите мне решить эту проблему.