feat(angular): add exposed methods for dynamic federation

[Coly010]

Current Behavior

We have no native solution currently for dynamic federation

Expected Behavior

Add a solution for native dynamic federation

Usage

In the bootstrap.ts file we set our remote definitions or use a function:

import { setRemoteDefinitions, setRemoteUrlResolver } from '@nrwl/angular/mfe';

// Straightforward method would be something as simple as:
fetch('/assets/manifest.json')
  .then((res) => res.json())
  .then(definitions => setRemoteDefinitons(definitions))

// where mainfest.json has shape
//
//   {
//      "login": "",
//      "todo": ""
//   }

// However, if more flexibility is needed
setRemoteUrlResolver(async (remoteName: string) => {
 const url = await fetch('/api/' + remoteName + '/config').then(res => res.json())
 return url;
});

We then load our remotes in our routing config via:

            {
              path: 'todo',
              loadChildren: () =>
                loadRemoteModule('todo', './Module').then(
                  (m) => m.RemoteEntryModule
                ),
              canActivate: [AuthGuard],
            },
            {
              path: 'login',
              loadChildren: () =>
                loadRemoteModule('login', './Module').then(
                  (m) => m.RemoteEntryModule
                ),
            }

Note: './Module' can be different if the user exposes more than one module from their remote.

[nx-cloud]

☁️ Nx Cloud Report

CI ran the following commands for commit b6692a7. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

---

✅ Successfully ran 8 targets

• nx affected --target=e2e --base=ca0ea5c174880efea7c3e9b2919b6426248dbc71 --head=b6692a7168aa43cddef13512ac92e302de166f26 --exclude=e2e-storybook,e2e-react-native,e2e-detox --parallel=1
• nx run-many --target=build --all --parallel=8 --exclude=docs,nx-dev-data-access-documents,nx-dev-e2e,nx-dev,nx-dev-feature-analytics,nx-dev-feature-conf,nx-dev-feature-doc-viewer,nx-dev-feature-search,nx-dev-feature-storage,nx-dev-feature-versions-and-flavors,nx-dev-ui-commands,nx-dev-ui-common,nx-dev-ui-home,nx-dev-ui-member-card,nx-dev-ui-sponsor...
• nx run-many --target=build --all --parallel=8 --exclude=docs,nx-dev-data-access-documents,nx-dev-e2e,nx-dev,nx-dev-feature-analytics,nx-dev-feature-conf,nx-dev-feature-doc-viewer,nx-dev-feature-search,nx-dev-feature-storage,nx-dev-feature-versions-and-flavors,nx-dev-ui-commands,nx-dev-ui-common,nx-dev-ui-home,nx-dev-ui-member-card,nx-dev-ui-sponsor...
• nx run-many --target=build --all --parallel=8 --exclude=docs,nx-dev-data-access-documents,nx-dev-e2e,nx-dev,nx-dev-feature-analytics,nx-dev-feature-conf,nx-dev-feature-doc-viewer,nx-dev-feature-search,nx-dev-feature-storage,nx-dev-feature-versions-and-flavors,nx-dev-ui-commands,nx-dev-ui-common,nx-dev-ui-home,nx-dev-ui-member-card,nx-dev-ui-sponsor...
• nx affected --target=test --base=ca0ea5c174880efea7c3e9b2919b6426248dbc71 --head=b6692a7168aa43cddef13512ac92e302de166f26 --parallel=1
• nx affected --target=build --base=ca0ea5c174880efea7c3e9b2919b6426248dbc71 --head=b6692a7168aa43cddef13512ac92e302de166f26 --parallel=3
• nx affected --target=lint --base=ca0ea5c174880efea7c3e9b2919b6426248dbc71 --head=b6692a7168aa43cddef13512ac92e302de166f26 --parallel=3
• nx build typedoc-theme

---

Sent with 💌 from NxCloud.

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/nrwl/nx-dev/Fd232TAWa1pJdfkXY8U5XN9eyynu
✅ Preview: Canceled

[Deployment for b6692a7 canceled]

[jaysoo]

LGTM. I guess there is a follow-up to add generators options for this?

[Coly010]

LGTM. I guess there is a follow-up to add generators options for this?

There will be yes 🙂

[leosvelperez]

LGTM! 🎉

[github-actions]

This pull request has already been merged/closed. If you experience issues related to these changes, please open a new issue referencing this pull request.