webpack - ホットモジュール交換の反応が機能しない

Question

if(true) {
        // When the styles change, update the <style> tags
        if(!content.locals) {
          module.hot.accept("../node_modules/css-loader/index.js?modules!./src/components/ex.css""../node_modules/css-loader/index.js?modules!./src/components/ex.css", function() {
            var newContent = __webpack_require__("../node_modules/css-loader/index.js?modules!./src/components/ex.css");
            if(typeof newContent === 'string') newContent = [[module.i, newContent, '']];
            update(newContent);
          });
        }

上記は私の bundle.js ファイルです。

ご覧のとおり、css コンポーネントが accept 関数の最初のパラメーターとして 2 回呼び出されていることがわかります。これが問題の原因だと思いますが、なぜ 2 回呼び出されるのかわかりません。構成ファイルと index.js も添付します。

ちなみに、module.hot.accept関数の使い方も知りたいです。

パラメータなしでうまく機能しますが、パラメータを指定すると、機能しなくなります。

パラメータは、昨日ドキュメントを読んだとき、ドキュメントが言った「依存関係」ですが、あまりにも曖昧で単純な答えです。

このホット アクセプト機能がどのように機能するか、どのパラメーターを使用する必要があり、何をすべきでないかを説明してください。

    import React from 'react';
    import ReactDOM from 'react-dom';
    import App from './components/App';
    import { AppContainer } from 'react-hot-loader';

    const rootElement = document.getElementById('root');

    const render = (Component) => {
      ReactDOM.render(
        <AppContainer>
          <Component/>
        </AppContainer>, rootElement
      );
    };

    render(App);

      if (module.hot) {
        module.hot.accept(() => {
          render(App);
        });
      }

    var path = require('path');
    var webpack = require('webpack');

    module.exports = {
        entry:  [
        'react-hot-loader/patch',

        'webpack-dev-server/client?http://localhost:8080',

        'webpack/hot/only-dev-server',

        './src/components/ex.css',

        './src/index.js'
      ],
        output: {
            path: __dirname + '/public',
            filename: 'bundle.js',
            publicPath: '/'
        },

        devServer: {
            inline: true,
            hot: true,
            contentBase: __dirname + '/public',
            historyApiFallback: true,
            watchContentBase: true,
            publicPath: '/'
        },

        resolve: {
          extensions: ['.js', '.css', '.json'],
        },

        devtool: 'inline-source-map',

        module: {
                rules: [
                    {
                        test: /\.js$/,
                        loader: 'babel-loader',
                        exclude: /node_modules/,
                        query: {
                            cacheDirectory: true,
                            presets: ['es2015', 'react']
                        }
                    },
                    {
                      test: /\.css$/,
                      loader: ['style-loader', 'css-loader?modules']
                    }
                ]
            },
        plugins: [
           new webpack.HotModuleReplacementPlugin(),
           // enable HMR globally

           new webpack.NamedModulesPlugin(),
           // prints more readable module names in the browser console on HMR updates
         ],
    };