Closed obfu5c8 closed 4 years ago
Try loading only one component at a time. I’m working out race conditions in tree shaken envs - got it working today, just need to repack it into the plugin. If you reload the page. Does it show up?
So what’s going on is that when your chunk needs more dependencies, it recursively Calls require.interleave, however how it watches for code to be installed is a little different than what I need for nested deps. So everything ends up resolving before the chunk totally done installing.
When running multiple interleaved files at one in parallel. They all write to the same queue. The recursive function doesn’t handle child calls correctly when there’s multiple and duplicates. In prod mode. Mostly because of scope changes and optimization.
So the working solution I have is to loop and return an array of promises for each nested chain. Then wait for those to resolve and be installed by webpack before resolving the parents and checking they are installed.
The file gets there but webpack is still registering the chunk modules. It resolves a little too soon. So it appears as if it should work. All resources are there. Yet one loop is still running for a few ms longer.
It’s hard to connect all the dots because of how templates are written. So I’m writing strings. Found this issue yesterday when I started working on tree shakes. Follow me on twitter or watch the repo. I’ll have a release soon
@obfu5c8 this fixes it https://github.com/ScriptedAlchemy/webpack-external-import/pull/111
Working on some cleanup and will release in a few days. Need to validate the rewrite still handles errors as expected
After stumbling across this plugin via your MicroFrontEnd Architecture article i've been playing around with it for my build and had it working very successfully while both apps were running inside webpack-dev-server.
Its a very simple setup, App (A) dynamically loads a single react component from App (B).
I then did a full prod build (B) and served the dist folder locally with the npm
serve
package. After switching the import url in (A) to point at (B)'s dist server, the import started throwing a ChunkLoadError atbootstrap:259
(inside the onScriptComplete function).I can see in the network logs that both the importManifest.js and the chunk file itself have been loaded into the browser successfully, so I'm totally lost as to why there's a behaviour change.
Any suggestions on what to poke next?