react-async-component: Async component won't hot-reload

I moved my app from code-split-component to react-async-component but the Async components don’t seem to hot reload properly. When I make a change to an Async component I get the usual messages in Chrome console with no differences ([HMR]… ) however the displayed content doesn’t change. If I change an Async component then also change a non-async component, the changes to both appear at the same time.

Relevant section of App.jsx:

import { withAsyncComponents } from 'react-async-component'

import store from './store'
import Root from './Root'

function renderApp(Param) {
  const app = (
    <AppContainer>
      <Provider store={store}>
        <Param />
      </Provider>
    </AppContainer>
  )

  withAsyncComponents(app).then(({ appWithAsyncComponents }) =>
    ReactDOM.render(appWithAsyncComponents, rootElement), // eslint-disable-line
  )
}

renderApp(Root)

if (module.hot) {
  module.hot.accept(
    './Root',
    () => renderApp(require('./Root').default), //eslint-disable-line
  )
}

AppContent.jsx:

import IntroductionAsync from './IntroductionAsync'

<Match pattern="/" exactly component={IntroductionAsync} />

IntroductionAsync.jsx:

import { createAsyncComponent } from 'react-async-component'

const AsyncIntroduction = createAsyncComponent({
  resolve: () => System.import('./Introduction'),
})

export default AsyncIntroduction

The problem occurs when I try to edit Introduction.jsx.

react-async-component@0.2.2 react-hot-loader@3.0.0-beta.6 react-router@4.0.0-alpha.6

Is there something I’m doing wrong or is this a bug of some sort?

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 18 (5 by maintainers)

Most upvoted comments

All, I am almost done with 1.0.0-alpha.2, which includes significant improvements towards supporting hot reloading, including React Hot Loader. So far it is working swimmingly, but I need to put it through some of my larger projects to know for sure.

This should land within a few days.