0

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

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 : [
    ...
 ]
 })

我做错了什么?

4

1 回答 1

1

对不起,这真的很容易,如果你不这样做,改变

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

简单来说

 module.hot.accept();
于 2017-02-07T15:46:58.790 回答