mountComponents gets called before registerComponents

[biw]

Hi! I am currently trying to set up webpacker-react in a codebase and am having a little trouble. I have an application.js pack that has dynamically loaded imports. Inside the modules I load, I call WebpackerReact.setup({ reactElm }). I get the following function call sequence:

1. setup()
2. mountComponents
3. registerComponents
4. mountComponents

Which throws Error: webpacker-react: cant render a component that has not been registered: HubBlock. I understand is due to:

https://github.com/renchap/webpacker-react/blob/563cd74775c588cdf1048332ac1f10f9cac4a7fe/javascript/webpacker_react-npm-module/src/index.js#L83-L89

I can call registerComponents and mountComponents without calling setup fix this. Am I doing something wrong? Is calling them on their own without setup okay?

[renchap]

Can you show me what your application.js looks like (the Webpacker calls as well as the imports and the general structure)?

[biw]

import 'babel-polyfill'

const pages = {
  show: async () => {
    await import(/* webpackChunkName: 'show' */ 'show')
  },
}

const { name } = window.page

// load the show page
pages[name]()

and show/index.js looks like:

import WebpackerReact from 'webpacker-react'
import reactBlock from './reactBlock'

// WebpackerReact.setup({ reactBlock })
WebpackerReact.registerComponents({ reactBlock })
WebpackerReact.mountComponents({ reactBlock })