Webpack 在没有路由器的情况下反应 HMR

Question

我需要在没有react-router的情况下启动 react js 项目，但是没有那个我就无法设置热模块替换，请您帮助我。
我的服务器

const app = express()
// Apply gzip compression
app.use(compress())
if (project.env === 'development') {
  const compiler = webpack(webpackConfig)
   debug('Enabling webpack dev and HMR middleware')
   app.use(require('webpack-dev-middleware')(compiler, {
   publicPath  : webpackConfig.output.publicPath,
   contentBase : project.paths.client(),
   hot         : true,
   quiet       : project.compiler_quiet,
   noInfo      : project.compiler_quiet,
   lazy        : false,
   stats       : project.compiler_stats
 }))
 app.use(require('webpack-hot-middleware')(compiler, {
   path: '/__webpack_hmr'
 }))
} else {
    ....
}

我的应用程序入口点。

const MOUNT_NODE = document.getElementById('root')
let render = () => {
   ReactDOM.render(
    <App store={store} />,
    MOUNT_NODE)
 }
 if (__DEV__) {
    if (module.hot) {
      // Development render functions
      const renderApp = render
      const renderError = (error) => {
      const RedBox = require('redbox-react').default
      ReactDOM.render(<RedBox error={error} />, MOUNT_NODE)
    }
    // Wrap render in try/catch
   render = () => {
      try {
         renderApp()
      } catch (error) {
         console.error(error)
         renderError(error)
      }
   }
  // Setup hot module replacement
   module.hot.accept('./App', () =>
     setImmediate(() => {
        ReactDOM.unmountComponentAtNode(MOUNT_NODE)
        render()
     })
   )
 }

}

其中./App是将我的应用程序包装在提供程序中的简单组件。

shouldComponentUpdate = () => false;
 render () {
    return (
    <Provider store={this.props.store}>
       <RootComponent />
    </Provider>  )
 }

主要问题是 - 当我保存这个或子文件时，HMR 重建并且没有任何变化，但即使，我使用路由器，并作为应用程序的入口点传递，而不是简单的组件 - 它工作正常。

export const createRoutes = (store) => ({
  path        : '/',
  component   : CoreLayout,
  indexRoute  : { onEnter: (nextState, replace) => replace('/songs') },
  childRoutes : [
    ...
 ]
 })

我做错了什么？

Answer 1

对不起，这真的很容易，如果你不愿意，请更改

 module.hot.accept('./App', () =>
    setImmediate(() => {
       ReactDOM.unmountComponentAtNode(MOUNT_NODE)
       render()
    })
 )

简单地

 module.hot.accept();