Использование угловых элементов для построения микроуслуг
Я использовал Angular Elements для создания микросервисов, и когда каждый микросервис является полностью изолированным микроприложением, все работает правильно.
<script src="bundle-a.js"></script>
<script src="bundle-b.js"></script>
<a-component></a-component>
<b-component></b-component>
Однако я заметил, что если угловые элементы вложены с использованием компонентов более чем одного микросервиса, это приводит к некоторым проблемам с пользовательским интерфейсом, которые очень сложно исправить.
<script src="bundle-a.js"></script>
<script src="bundle-b.js"></script>
<a-component>
<b-component></b-component>
</a-component>
Например, вложение компонентов таким способом вызывает следующие проблемы:
Обнаружение изменений должно быть запущено вручную (см. https://github.com/angular/angular/issues/24061).
-Трансклюзия не работает правильно (см. https://github.com/angular/angular/issues/24536)
-Не может создавать или уничтожать компоненты динамически (возможно, связано с проблемой обнаружения изменений выше)
Вариант использования для этого - это повторно используемый компонент пользовательского интерфейса (например, кнопка или таблица данных), на который ссылается другой микросервис.
Альтернативой этому является включение общих компонентов пользовательского интерфейса в качестве зависимости NPM в каждый микросервис. Однако недостатком этого подхода является то, что если общие компоненты пользовательского интерфейса изменяются, мне необходимо перестраивать каждое приложение-потребитель.
У кого-нибудь есть предложения? Важно, чтобы каждый микросервис мог создаваться и развертываться независимо, поэтому на него следует ссылаться как на JS-инкапсуляцию времени выполнения, а не на зависимость NPM.
Из моих исследований до сих пор выяснилось, что Angular Elements предназначена для изолированных микро-приложений, а не для библиотеки компонентов пользовательского интерфейса, которая может использоваться несколькими микросервисами.
Спасибо,
Alex