react-hot-loader 正确检查但不更新答案

【问题标题】：react-hot-loader checking correctly but not updatingreact-hot-loader 正确检查但不更新
【发布时间】：2017-11-30 00:54:25
【问题描述】：

最小回购Here

我正在尝试开发 react + electron + webpack2 演示项目。目前我被困在react-hot-loader3。如下图所示，热更新检查似乎工作正常，但没有按预期更新（我对 Component 所做的更改未更新）。这与电子有关吗？我以前从未使用过 react-hot-loader。

webpack.config.js

var path = require('path');
var webpack = require('webpack');
var HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
  entry: [
    'react-hot-loader/patch',
    path.resolve(__dirname, './src/index.jsx'),
  ],
  output: {
    publicPath: '/',
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
  },
  module: {
    rules: [
      {
        test: /\.js*/,
        include: [ path.resolve(__dirname, 'src') ],
        loader: 'babel-loader',
      }, {
        test: /\.less$/,
        use: [
          { loader: 'style-loader' },
          { loader: 'css-loader' },
          { loader: 'less-loader' },
        ],
      },
    ],
  },
  resolve: {
    alias: {
      'COMPONENTS': path.resolve(__dirname, './src/components'),
      'CONTAINERS': path.resolve(__dirname, './src/containers'),
      'MODELS': path.resolve(__dirname, './src/models'),
      'ROUTES': path.resolve(__dirname, './src/routes'),
      'SERVICES': path.resolve(__dirname, './src/services'),
      'THEMES': path.resolve(__dirname, './src/themes'),
    },
    extensions: ['.js', '.jsx', '.less'],
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),

    new webpack.NoEmitOnErrorsPlugin(),

    new webpack.NamedModulesPlugin(),

    new HtmlWebpackPlugin({
      template: path.resolve(__dirname, 'src', 'index.html'),
    }),
  ],
  devtool: 'source-map',
  target: 'electron-renderer',
  devServer: {
    port: 8000,
    hot: true,
    historyApiFallback: true,
  },
};

index.jsx

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

const main = document.createElement('div');
main.id = 'main';
document.body.appendChild(main);

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

doRender(Routes);

if(module.hot) {
  module.hot.accept('./routes', () => {
    doRender(Routes);
  });
}

routes/index.jsx

export default class Routes extends React.Component {
  render() {
    return(
      <div>routes</div> // change text here did not update correctly.
    );
  }
}

【问题讨论】：

标签： javascript reactjs webpack react-hot-loader

【解决方案1】：

已解决此问题，最小 repo 为 here。希望这会有所帮助。

【讨论】：