How to call angular component into another angular app

Question

I have requirement to separate my current application into 3 different Angular application.

App1: common (Dashboard angular app) App2: module1 (Sales angular app) App3: module2 (Customer angular app)

App1(Dashboard) will have 2 links => .。 On click of link respective app will get called and load. All 3 app's are located into different location (different repository).

Is that possible? Can I call other app's on my dashboard?

Answer 1

I don't know how much time you're willing to spend on it, but if I were you, I'd look at https://nx.dev , use case you're providing is a textbook case that monorepos are good at and NRWL (nx.dev) solve this very, very elegantly.

Answer 2

In my experience, you have two options.

First Option:

Create a custom Angular Library where you create/add all the components and services shared for the different applications. Then you install the custom library in each Angular Project.

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

https://medium.com/@tomsu/how-to-build-a-library-for-angular-apps-4f9b38b0ed11

Second Option:

Use the Monorepo Approach: https://christianlydemann.com/why-angular-teams-fail-at-code-sharing-and-how-this-mono-repo-approach-will-fix-it/

To use the monorepo approach I know two libraries:

• Nx: https://blog.nrwl.io/announcing-nrwl-nx-1-0-33d888666bfc
• Lerna: https://github.com/lerna/lerna