How do I reuse a MFE in another web app?

[HelloooJoe]

Lets say I wanted to reuse the 'Menu' microfrontend inside another web app, how would I be able to do that with the module federation architecture?

Side note: I know if I use @angular/elements, in a normal Ng app, I can create a custom web component that I can then insert into another web app like so:

[jtneal]

With module federation, after you build your application, you'll get something like a remoteEntry.js file. This remote entry file is similar to your menu-mfe.js that you would have had in the web component approach. You would typically configure your host to load this file at runtime rather than placing it in your HTML like you've shown here.

This shows an example of loading the remote entry:
https://github.com/jtneal/ng-module-federation-demo/blob/main/src/main.ts#L6

This is where you can define routes pointing to the micro frontend:
https://github.com/jtneal/ng-module-federation-demo/blob/main/src/app/app-routing.module.ts#L6

The code I've linked above is using a package I wrote that wraps around another API just to make things a bit easier, but looking at the source may be beneficial. Here's a good article that shows the code:
https://www.angulararchitects.io/en/aktuelles/dynamic-module-federation-with-angular/