Am I doing something wrong? This is using webpack HMR which I read in another issue thread isn't working well with this.
** NOTE: This is hapenning for me with or without Hot Module Replacement enabled.
My dev/HMR and production builds both need the setTimeout wrapping loadComponents().then() in order to hyrdrate properly due to the undefined window.LOADABLE_COMPONENT_IDS.
in
gregberge
commented on September 14, 2024
1
nreoch25
commented on September 14, 2024
nreoch25
commented on September 14, 2024
-
problem with redial
HOT 2
-
How to change referencing external styles to preload mode
-
Fallback running even when component has previously loaded
HOT 1
-
Webpack doesn't like @loadable/server 5.16.4
HOT 5
-
Server is caching old request split chunks, and these are not being re-requested when a new request is made to the server.
-
ctor.requireAsync is not a function error
HOT 1
-
Race condition
-
Support the chunkName method
-
Can use this package for React Native?
-
Duplicate app when hydrate
HOT 3
-
Main.js is rendered on every page even if I splitted each page into chunks with @loadable/component
-
error in ./node_modules/@loadable/component/dist/loadable.esm.mjs
HOT 9
-
Why ChunkExtractor is required?
HOT 3
-
Is website sync with repo?
-
If I am using react18, do I still need loadable-components
HOT 6
-
Add esbuild support
HOT 3
-
react-native-web SSR support
HOT 1
-
Loading state is always true on first render
HOT 4
-
Add query parameter support
HOT 3
-
SSR is broken for component v5.16.2+
HOT 6
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
-
from loadable-components.
Comments (3)
Thank you!
You should put
getScriptTag
before yourbundle.js
https://github.com/nreoch25/mern-boilerplate/blob/master/server/server.js#L97from loadable-components.
Something I noticed for this:
When loadComponents() is called this is undefined: window.LOADABLE_COMPONENT_IDS
So this line in loadComponents.js returns an empty array: var ids = window[_constants.COMPONENT_IDS] || [];
When that is an empty array it triggers the above warning/issue.
I was able to get around this by wrapping the loadComponents() call in a:
setTimeout(() => { loadComponents().then(() => { "REACT APP" }); }, 0)
;Am I doing something wrong? This is using webpack HMR which I read in another issue thread isn't working well with this.
** NOTE: This is hapenning for me with or without Hot Module Replacement enabled.
My dev/HMR and production builds both need the setTimeout wrapping loadComponents().then() in order to hyrdrate properly due to the undefined window.LOADABLE_COMPONENT_IDS.
thanks in advance.
from loadable-components.
Thanks bud! Really appreciate the reply.
from loadable-components.
Related Issues (20)
Recommend Projects
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
TensorFlow
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
Recommend Topics
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
web
Some thing interesting about web. New door for the world.
server
A server is a program made to process requests and deliver data to clients.
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Visualization
Some thing interesting about visualization, use data art
Game
Some thing interesting about game, make everyone happy.
Recommend Org
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.