3

I am working through a module federation PoC in angular (essentially Manfred's example) and am hoping to find a way to expose utility classes/directives/individual components, and any other code that doesn't necessarily rely on routing to components.

The module federation package @angular-architects/module-federation for angular seems to strictly load in modules based on routing.

I'm hoping to be able to load in and use 'federated module' code , ideally from a 'shared module' (or, on the first pass, from our app 'shell'), without necessarily just loading in components for use in routing. I believe I saw some things involving bidirectional module federation that could answer it but I wasn't seeing anything built into the angular architects package.

What I want to avoid is using something like npm for library management, but I'm not sure module federation is at that point yet (perhaps at least not for angular?).

iamaword
  • 1,327
  • 8
  • 17
  • It is called ‘module’ federation- however, you don’t have to go component/route based. You can fairly easily have a remote module that you load dynamically (runtime, the host doesn’t even have to know about it build time) that ‘shares’ services / directives or any other things. Just export those from a remote module. Is that what you need? – MikeOne Oct 27 '21 at 22:03
  • I'm going to dive into the idea of sharing services, since I think it will be a requirement for our authentication. – iamaword Oct 28 '21 at 12:24
  • @imaword Do you got any concrete solution to share components from shell to MFE's ? – Rajat Sep 07 '22 at 04:10
  • this is probably the best resource I can point to, though it's been a while since I've tinkered with this: https://www.angulararchitects.io/aktuelles/dynamic-module-federation-with-angular-2/ – iamaword Sep 08 '22 at 03:46
  • you can also use an npm package to separate out components entirely and share the dependency between apps via module federation, but of course you have to track and manage versioning at that point – iamaword Sep 08 '22 at 03:47

1 Answers1

0

One way to load remote module is "statically" on a route as you mentioned. The other way is dynamically. You can call loadRemoteModule anytime anywhere. Manfred Steyer has an example called module-federation-with-angular-dynamic.

JanBrus
  • 1,198
  • 9
  • 13