More info on this plugin and the MFEs
See original GitHub issueHey Zack, I’ve been really interested in some of the things you’ve working on! Was hoping to find out more about this plugin.
Say my architecture consists of a single SPA that pulls in 15 individual React components that are each published as their own npm packages. (Each component is a whole section of the site.) This results in a bottleneck, where the whole SPA needs to be deployed in order for updated components to be deployed.
I believe this plugin would instead allow me to deploy components individually, and have them pulled in from external URLs at runtime, correct?
I’m curious how we’d manage common dependencies that are used across the SPA/individual components. Currently, the SPA declares them as actual dependencies, while the components declare them as peerDependencies
, so the SPA is the source of truth for a common dep and its version. Interested to hear how we’d approach this when the components aren’t being bundled in the context of the entire SPA.
Finally, I haven’t dug deep in to MFEs. Are there solutions that even come close to doing what this plugin does?
Thanks for humoring my questions. Let me know if you need any docs written!
Issue Analytics
- State:
- Created 4 years ago
- Comments:12 (12 by maintainers)
Top GitHub Comments
Respond would require a call.
Okay so to your situation, this tool will still work for your need. Assuming you don’t server side render. If you do then there last a little more complexity.
As you see in the demo I can load jquery or something. So it works for getting scrips on the page. It’ll depend how you access them once they are on the page, you’ll need to actually reference the function you need to envoke if it’s commonjs bundles, then _ _ webpack_require _ should grab the library name. Or you can always make it self envoking which exposes itself as a window global.
However the best way would still be to build it with webpack on one side and pull the module out like I’m doing.
What you need, with current architecture, this thing can do
Run this. Go to localhost:3001. https://github.com/ScriptedAlchemy/webpack-external-import/pull/11
from root directory.
npm run manual
npm install, and npm install inside themanual
folder