¿Cómo incrustar una aplicación angular en otra aplicación?

Mi equipo desarrolló una aplicación angular 5 que ha estado en producción durante un tiempo, pero recientemente se nos ha encomendado hacer que la aplicación funcione en otros 3 sitios que posee la compañía. Un sitio es un SPA construido con Angular6, otro también es un SPA pero usa Angular5, mientras que el otro usa algunas bibliotecas más antiguas como jQuery.

Management quería que nos integremos con Angular5 SPA de inmediato, por lo que solo exportamos toda la aplicación como un módulo con rutas secundarias y dejamos que la otra aplicación haga el arranque.

Pero me temo que el enfoque anterior no funcionará para el sitio no angular. Esto también combina estrechamente ambas aplicaciones, ya que la aplicación 'host' necesita conocer todas las dependencias de nuestra aplicación, que no es una aplicación trivial (diría que es bastante grande) e instalarlas, esto causó problemas cuando ambas aplicaciones necesitaban diferentes versiones de la misma dependencia, sin mencionar que tendremos que sincronizar al actualizar las dependencias o el propio marco. No creo que este enfoque vaya a escalar al incorporar la aplicación en más sitios.

Mi primera idea para una implementación más general fue actualizar nuestra aplicación a Angular 6 y crear un componente web con un elemento personalizado, pero necesitamos admitir IE11 y Edge que no admiten la encapsulación nativa, por lo que necesitaríamos probar nuestra aplicación en cada sitio donde se usa, para asegurarme de que no rompan nuestros estilos, tampoco sé si un componente web puede administrar rutas secundarias o no.

Otra idea es usar un iframe, pero mi problema aquí es el cambio de tamaño del iframe para adaptarse al contenido y cómo agregar rutas secundarias en la aplicación 'host' desde la aplicación 'residente' dentro del iframe.

Existe una mejor manera de lograr lo que necesitamos hacer?

La solución ideal debería permitir que nuestra aplicación se use en múltiples sitios (cada uno con una configuración específica) sin que tengamos que saber sobre el sitio usando nuestra aplicación.

Gracias por tu ayuda

Respuestas a la pregunta(3)

Su respuesta a la pregunta