Skip to content

Instantly share code, notes, and snippets.

What would you like to do?
for ingvar
// consider the following code
// a.js
class A extends Component {
static B = undefined;
state = { B : A.B };
componentWillMount() {
A.B || import('./b.js').then(B => {
A.B = B;
this.setState({ B });
return this.state.B ? <B/> : '...loading'
// b.js
module.exports = () => 'b!'
// I want to be able to server render a page, and rehydrate on the front end.
// - when server rendering, I want import(B) to be sync, so I can render children
// - when client rendering, with server side output, and if B is already included in the js bundle, render should be sync again.
// - when client rendering a new page, and B perhaps isn't in the bundle, I want to load b.js async
// This was achievable with require.ensure - sync on the server, sync when bundle is already loaded, and async when not.
// simply because it took callbacks.
// import () makes all of these always async, so I have no way of achieving my goal in the same module.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.