Query #1
Here's a successful approach I implemented:
Stage 1
I organized all essential components in a core module within a core application.
Stage 2
I defined the CustomModule function in the core app as follows:
declare var Reflect: any;
export function CustomModule(annotations: any)
{
return function (target: Function)
{
let parentTarget = Object.getPrototypeOf(target.prototype).constructor;
let parentAnnotations = Reflect.getMetadata("annotations", parentTarget);
let parentAnnotation = parentAnnotations[0];
Object.keys(parentAnnotation).forEach(key =>
{
if (parentAnnotation[key] != null)
{
if (typeof annotations[key] === "function")
{
annotations[key] = annotations[key].call(this, parentAnnotation[key]);
}
else if (Array.isArray(annotations[key]))
{
let mergedArrayItems = [];
for (let item of parentAnnotation[key])
{
let childItem = annotations[key].find(i => i.name == item.name);
mergedArrayItems.push(childItem ? childItem : item);
}
annotations[key] = mergedArrayItems;
}
else if (annotations[key] == null)
{
annotations[key] = parentAnnotation[key];
}
}
});
let metadata = new NgModule(annotations);
Reflect.defineMetadata("annotations", [metadata], target);
};
}
Stage 3
In a separate application, I established a module called InheritedModule and developed components that inherit from those in the CoreModule. The inherited component should have identical names and selectors as the parent component.
Stage 4
I ensured that InheritedModule inherited from the CoreModule and was declared with the CustomModule annotation mentioned above (not using NgModule).
This new module should declare and export the components created in Stage 3.
@CustomModule({
declarations: [Component1, Component2],
exports: [Component1, Component2],
bootstrap: [AppComponent]
})
export class InheritedModule extends CoreModule
{
}
Stage 5
Import InheritedModule into the child app.
The custom module function will merge annotations of the two modules and substitute CoreModule components with InheritedModule components when they share the same name.
Query #2
If I need to override parts of the HTML from the core app, I may have to replace sections with small components. I will keep the answer pending to explore better suggestions.