Tldr: how to compile angular library with recursive components?
Prehistory: I have an application which purpose is to display complex forms. First you have to create an array of fields, then you pass the array to app-form component and it creates components that correspond to type of a certain field. Like this:
<div *ngFor="let field of fields">
<app-input *ngIf="item.type === 'input'"></app-input>
<app-checkbox *ngIf="item.type === 'checkbox'"></app-checkbox>
<app-tablist *ngIf="item.type === 'tablist'" [form]="field"></app-tablist>
<app-cardlist *ngIf="item.type === 'cardlist'" [form]="field"></app-cardlist>
...
</div>
This is a simplified app-form template. As you can see there are basic field types - inputs, checkboxes, etc - and there are complex field types - tablists cardlists. Complex fields have references to app-form in their templates, here is tablist' template for example:
<mat-tab-group>
<mat-tab *ngFor="let form_field of form.fields; index as i;">
<mat-card>
<app-form [form]="form_field.value"></app-form>
</mat-card>
</mat-tab>
</mat-tab-group>
There are recursive components: form > tablist > form, they never caused troubles
Now I need to extract app-form to library so I can use it throughout many applications. But when I build the library it says "One or more import cycles would need to be created to compile this component, which is not supported by the current compiler configuration". Is there anything I can do about it?
Thanks in advance
Seems like at the moment there is no way Ivy can build libraries with recursive components, there is an issue about it in angular github. They say the problem should be resolved after adding sideEffects: true to library' package.json, but it doesn't seem to have any effect for me, so I ended up moving all the 2nd level components to the parent component: all the components that have form in their templates are now defined in form.component file