Loadable-components: SSR - HMR is not working

Created on 29 May 2019  ·  8Comments  ·  Source: gregberge/loadable-components

Hello.
I have an app with SSR, Loadable, and HMR.

My problem is:

  • Whenever I want to start app without building as you will see in my code, it gives an error (stats json can not be found)
  • Whenever I build first and then start the server: HMR is not working correctly. Sometimes it is showing every version of changes of current file/route. And sometimes i can see stats json duplicated such as stats 6.json stats 5.json.

My code;

https://gist.github.com/jrsakizci/17b3da73a775e18ffcee2ff8ea0b6145

And this is where I render the app

https://gist.github.com/jrsakizci/76655982fd8235a2a0aaef2ca963ce32

Please, help.

question ❓

Most helpful comment

@jrsakizci can you please format it properly so it easier to read?. I had a similar setup where finally I got it working maybe it could help you. You can checkout for example this one https://github.com/pavliha/nikosFrontend.
And HMR on server side don't work properly as far as I know. What I saw everybody is doing they disable SSR when developing and leave SSR only for production

All 8 comments

@jrsakizci can you please format it properly so it easier to read?. I had a similar setup where finally I got it working maybe it could help you. You can checkout for example this one https://github.com/pavliha/nikosFrontend.
And HMR on server side don't work properly as far as I know. What I saw everybody is doing they disable SSR when developing and leave SSR only for production

@jrsakizci can you please format it properly so it easier to read?. I had a similar setup where finally I got it working maybe it could help you. You can checkout for example this one https://github.com/pavliha/nikosFrontend.
And HMR on server side don't work properly as far as I know. What I saw everybody is doing they disable SSR when developing and leave SSR only for production

Thanks for your answer. I updated my code (added to gist). I have i18n and styled component and stuff.. How can i initialize this when i run with Webpack Dev Server?

@jrsakizci I could not find any error output. So much stuff is going in there so It hard to grasp. Can you make a screenshot what exactly is failing?

I have the same problem
@jrsakizci In my opinion it's a really bad thing to disable SSR when developing... You're missing some potential problem which can occur only on server side.

@ChibiBlasphem completely agree that you could miss some things. But on other side without SSR enabled for development you would get much faster build and less buggy experience because you don't have to hot reload both server and client. Hot server reload doesn't work quite nicely right now. If some issues do occurr though you'll always be able to run and test build when done developing

Hello just a clarification here. Loadable Components does not support HMR either using react-hot-loader or another thing. I don't plan to support it until React provides an official solution. If you want it, you have to do it by your own.

@gregberge Can you please put this at the front of all docs, it's a pretty huge gotcha considering this package is officially recommended by react

SSR HMR was always a thing "platform" has to support, not a library itself.
With FastRefresh a few things became easier on the ClientSide, but nothing yet changed on SSR - by default it is just not enabled.

Was this page helpful?
0 / 5 - 0 ratings