How can I display 'directives' and 'pipes' from angular micro app to the shell?

Asked Oct 03 '22 at 07:10

Active Oct 03 '22 at 07:48

Viewed 201 times

this question is about micro frontend architecture for angular apps with webpack module federation plugin:

In this case :

when remote app and shell app angular versions are different (for example shell is 13 and remote is 14), I have a problem

the problem is :

I can display the remote app in the shell ...

but some things are not displayed in the shell, like directives (even built-in directives) and in the browser console, I got this error

Can't bind to 'ngIf' since it isn't a known property of 'h1'

but when I serve and run the remote app alone (not in the shell), directives worked without any problem

What should I do?

Do you have any experience?

project link :

edited Oct 03 '22 at 07:48

asked Oct 03 '22 at 07:10

saeed

1

You probably need the same Angular version, or create a web component from the remote. Angular 13 and Angular 14 are two different incompatible versions. I recommend you to use a monorepo such that all your remotes and shell share the same third party package versions. – Stefan Oct 30 '22 at 17:08

0 Answers0