Además, ya tengo todos los pasos de compilación configurados para mi código Stylus (compilaciones incrementales con Gulp), que genera un solo archivo CSS en mi directorio público.

Por lo tanto, ahora también me gustaría aprovechar la recarga en caliente de Webpack para CSS, ya que ya tengo eso para mis cosas de TypeScript, pero no quiero que compile mis archivos CSS, ya que tengo algo excelente para eso. Idealmente, solo quiero que Webpack vuelva a cargar mi único archivo CSS cada vez que cambie. ¿Cuál es la forma más simple y mejor de lograrlo?

Mi archivo de configuración actual se ve así:

const webpack = require('webpack');

module.exports = {
  entry: [
    'webpack-hot-middleware/client',
    './src/client/index.tsx'
  ],
  output: {
    path: '/public/js/',
    filename: 'bundle.js',
    publicPath: '/js/'
  },
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.tsx', '.js']
  },
  module: {
    loaders: [
      {
        test: /\.tsx?$/,
        loader: 'ts-loader'
      }
    ]
  },
  plugins: [
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.HotModuleReplacementPlugin()
  ];
};

Y luego, uso Webpack Hot Middleware y Webpack Dev Middleware como este:

const webpackConfig = require('../webpack.config');
const compiler = webpack(webpackConfig);
app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: webpackConfig.output.publicPath }));
app.use(webpackHotMiddleware(compiler));