Why doesn't webpack-dev-server update when stylus files change?

Question

webpack

Good afternoon! I am writing a simple webpack react config

const webpack = require('webpack');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const WebpackNotifierPlugin = require('webpack-notifier');

const config = {
   entry: [
      "./_f/app.js"
   ],
    
   output: {
      path: __dirname + "/_p",
      filename: "st.js"
   },
    
   devServer: {
      contentBase: "./_p",
      historyApiFallback: true,
      inline: true,
      port: 2000
   },
    
   module: {
      rules: [
         {
            test: /\.(js)$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            options: {
               presets: ['es2015', 'react']
            }
         },
         {
            test: /\.styl/,
            exclude: /node_modules/,
            use: ExtractTextPlugin.extract({
               fallback: 'style-loader',
               use: [
                  {
                     loader: 'css-loader',
                     options: {
                        sourceMap: true,
                        minimize: true
                     }
                  }, 'autoprefixer-loader?browsers=last 2 versions', 'stylus-loader']
            })
         }
      ],
 
   },

   plugins: [
      new ExtractTextPlugin('st.css'),
      new WebpackNotifierPlugin,
      new webpack.HotModuleReplacementPlugin()
   ],
   devtool: "cheap-inline-module-source-map",
}
module.exports = config;

The config itself works, but the webpack-dev-server does not reload when changing the stylus files, only if you manually update the contribution in the browser, then everything is OK, the st.css files are collected. If you change js files, then webpack-dev-server works there, everything is ok. File stylus do import './app.styl'; in js file. Each component has its own stylus file. I would like css to change instantly, and not when reloading the tab manually. Please tell me where the error is, otherwise I can’t figure it out anymore.

Answer 1

After a day of manipulation, I did it differently, removed --hot

"scripts": {
    "start": "webpack-dev-server  --hot"
  },

and installed hot-loader in the config and now everything is reloaded when changing files, but I still couldn’t achieve a replacement without a reboot, I’ll have to do this for now.