question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

More info on this plugin and the MFEs

See original GitHub issue

Hey 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:closed
  • Created 4 years ago
  • Comments:12 (12 by maintainers)

github_iconTop GitHub Comments

1reaction
ScriptedAlchemycommented, May 5, 2019

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

1reaction
ScriptedAlchemycommented, May 5, 2019

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 the manual folder

Read more comments on GitHub >

github_iconTop Results From Across the Web

@mfes/webpack-plugin - npm Package Health Analysis | Snyk
Learn more about @mfes/webpack-plugin: package health score, popularity, security, maintenance, versions and more.
Read more >
What Are Micro-Frontend Web Applications? - ITMAGINATION
In a nutshell, MFEs are a way of structuring a web application as a collection of small, independently deployable modules. Each module has...
Read more >
Developing MFEs using Tutor - Open edX discussions
Hi. I'm running into a problem setting up a local development environment for MFEs using tutor. I have managed to bring up my...
Read more >
Micro-Frontends at scale with Module Federation
When a MFE exposes code for other MFEs to consume, the filename ... Review our Privacy Policy for more information about our privacy ......
Read more >
MFEs , Micro-Frontends with Module Federation and Angular
Have you ever considered using multiple frameworks or framework versions for one application? Clearly this is best avoided.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found