Currently in the process of developing a custom Angular library using Angular v 8.1.0, I am interested in figuring out how to organize it into different sub-libraries.
For instance, the Angular core is divided into separate parts like:
- @angular/common
- @angular/core
- @angular/forms
- and more.
Similarly, @angular/common has sub-directories that can be imported from:
- @angular/common/http
- @angular/common/locale
- @angular/common/testing
I aim to implement a similar structure in my Angular library named cool-lib. I want different feature modules, such as common, featureA, and featureB, to remain independent of each other and have their own services/components, etc.
My goal is to achieve something like this:
import { CommonService } from 'cool-lib/common';
import { FeatAComponent, FeatAService } from 'cool-lib/feature-a';
import { FeatBModule } from 'cool-lib/feature-b';
Instead of:
import {
CommonService,
FeatAComponent,
FeatAService,
FeatBModule
} from 'cool-lib';
It would also be beneficial to be able to update the version numbers of individual feature modules independently or have the flexibility to only install the necessary modules without installing the entire library (e.g., only needing featureA).
For example, in the package.json:
{
"dependencies": {
"cool-lib/common": "1.0.0",
"cool-lib/feature-a": "1.0.0",
"cool-lib/feature-b": "1.3.0"
}
}
or simply:
{
"dependencies": {
"cool-lib/feature-a": "1.0.0"
}
}
Instead of:
{
"dependencies": {
"cool-lib": "1.0.0"
}
}
I have researched extensively on creating Angular libraries, but have not come across a solution for this specific scenario. Any guidance on this matter would be greatly appreciated!