How can i Configuring an Angular Library to Support Multiple Products with Shared Functionality

I'm working on an Angular library for a fintech company that has three different products. While the interfaces differ, the underlying functionalities are quite similar. Our project manager wants to host this library on npm, so it can be installed whenever a new product is created.

Our backend uses a single base URL that accepts a config query parameter to determine which project is making the request. I need guidance on how to effectively manage the configuration for the library to adapt to different products.

Concerns: I'm unsure about the feasibility of these approaches and whether they can effectively handle different environments (development, staging, production). What are the pros and cons of each approach? Are there best practices for managing configurations in an Angular library that should be considered? Any insights or recommendations would be greatly appreciated!

I have two ideas in mind:

NPM Arguments: When installing the library, pass an argument indicating the project name (e.g., npm install your-library --project-name=myProject). This way, the library can configure itself accordingly.

Configuration File: Each product would maintain a project-config.json file containing details like the project name and API base URL. The library would read this file to determine the necessary configurations.

Continue reading...