SSR not loading synchronously and CSS never loads for SSR page
See original GitHub issue@faceyspacey thanks again for the great work. I’m at a point where I’ve tried what I believe to be every avenue and just completely stuck.
I’m trying to upgrade to the babel-plugin-dual-import
but it breaks SSR for react-universal-component
s only in my production config. I see 2 symptoms
- The SSR always comes back with the
Loading...
no matter which route I hit (or which view is universally dynamically included) - The styles/css for that page are never loaded, even if I navigate away and back
If I navigate (using redux-first-router
/redux-first-router-link
) client-side to a view, the css loads just fine.
I’ve looked through the issues in your various repos and since I’m not the best at webpack configs, I think I’m at the point of randomly making changes which isn’t a great way to troubleshoot.
I’m using koa
for the server, so I have to translate all of your examples. We have a hodgepodge mess of CSS at the moment b/c we’re using components that include their own global CSS, but that doesn’t seem to affect things in dev.
We’re using webpack server-side b/c I couldn’t get HMR working with just babel early on, however, the major difference between dev and production servers is that due to the hot module server middleware, in dev we are using the render middleware as the entrypoint whereas in production, the server itself is the entrypoint. Do you think this could be the cause?
Also 2 pieces of advice to improve the DX:
- The boilerplates need to be kept up with the “latest” developments as I’m not sure which one I should use as the example configuration.
- Convert all of this to a monorepo so that there is one place for issues and code. I like the different modularization of the system, but it’s very hard to investigate which issues are relevant.
Issue Analytics
- State:
- Created 6 years ago
- Comments:15 (8 by maintainers)
Top GitHub Comments
I’m going to close this, as we solved @aga5tya 's problems on chat. The main problem was that the
webpack-node-externals
package behaves funny. If you follow the precise directions forexternals
in the readme, it solves his issue. Perhaps that was yours issue too, @eudaimos.Hit me on chat if you need anything. In a few hours the React Universal Component 2.0 article is going out with the new babel-plugin-universal-import which eliminates the ned to manually use
resolveWeak
. @eudaimos as for themonorepro
idea, we’re a weak off fromuniversal-render
which will consolidate every single package under only one you have to use.So things will just keep getting better and easier.
ps. the docs to all these packages were updated a few days ago.
I’m actually in travelling , and i’m sure its something to do with my configuration since it’s not replicable on the boilerplate. So i think u can go ahead with the article… Cheers 🍻 I’ll check again and hit u with repro asap.