Angular Module Federation and remote services

Issue

I´m decomposing an Angular web in several microfrontends. One of these microfrontend handles the shopping cart, and it has a service to store products that have been added. My shell microfrontend needs to use that service to show in a icon how many items are in the car, add new items, etc.

Can I use a service in a microfrontend that is stored in a different microfrontend?

I´m using this tutorial, but it only explains how to route a page that are in another microfrontend.

Thanks.

Solution

Can I use a service in a microfrontend that is stored in a different microfrontend?

No. Code in your microfront end is not shared among each other.

You need to create a library project within your repository. This library will be shared among your micro-apps. Here you can create a service which will be used to store some data & share it among apps.

https://angular.io/guide/creating-libraries

Is using Nx Workspace: https://nx.dev/workspace/library

Answered By - Pankaj Sati