我的团队开发了一个已经投入生产一段时间的角度5应用程序，但我们最近的任务是让应用程序在公司拥有的其他3个站点中运行。一个站点是使用Angular6构建的SPA，另一个站点是SPA但使用Angular5，而另一个站点使用一些较旧的库，如jQuery。
管理层希望我们立即与Angular5 SPA集成，因此我们只是将整个应用程序导出为具有子路由的模块，并让其他应用程序执行引导程序。
但我担心上述方法不适用于非角度站点。由于“主机”应用程序需要知道我们的应用程序的所有依赖关系，这不是一个简单的应用程序（我会说相当大）并且安装它们，这导致两个应用程序需要不同版本的相同的依赖关系，更不用说我们需要在升级依赖项或框架本身时进行同步。在将应用程序嵌入更多站点时，我认为这种方法不会扩展。
我对更一般实现的第一个想法是将我们的应用程序升级到Angular 6并使用自定义元素创建Web组件，但我们需要支持不支持本机封装的IE11和Edge，因此我们需要测试我们的应用程序使用它的每个站点，以确保它们不会破坏我们的样式，我也不知道Web组件是否可以管理子路由。
其他想法是使用iframe，但我的问题是iframe调整大小以适应内容以及如何在'host'应用程序中从iframe中的'常驻'应用程序添加子路由。
有没有更好的方法来实现我们需要做的事情？
理想的解决方案应该允许我们的应用程序在多个站点中使用（每个站点提供特定的配置），而无需我们使用我们的应用程序了解该站点。
谢谢你的帮助。
我最近一直忙于这个话题，因为很多人一次又一次地遇到同样的问题（当然，我）。如今，你经常听到微前端的概念。该概念是关于将前端设计为可扩展和可扩展的。特别是在很多公司同时拥有Angular，React和Vue开发人员的时候。我的研究得出以下方法：
链接：
您可以创建新应用并从旧版应用中获得超链接。 （当您在两个应用程序之间切换时，必须重新加载页面。）
iframe：
软件架构师构建了一个元路由器来处理iframe和单页面应用程序： 看看这个：
Metaframeoorks：
Metaframeworks允许您在使用不同框架构建的
differents应用程序之间进行通信： 这里是微框架目的的一些metaframeworks示例。
Web组件即角元素：
为了处理npm包你可以使用另一个回答者提到Angular elements的概念。您必须创建一个shell应用程序和另一个独立的应用程序，这些应用程序将在您的shell应用程序中注册为元素。看一下这个例子：Building micro frontends — angular elements
Mosaiq：布局服务
网上商店Zalando面临同样的问题，并创建了一个框架，以解决问题：
特别是部分Tailor.js，一个开源系统，用于在Go上编写的后端层上按需组装组件。
PS。 Tailor的灵感来自Facebook的BigPipe: Pipelining web pages for high performance。
插件架构
插件体系结构是一种体系结构，它可以在某些点调用外部代码，而无需事先知道该代码的所有细节。
This Stackoverflow question在单页应用的情况下解释更多关于它的信息：
角度库
我认为正确的方法是在应用程序中使用相同的框架和相同版本的框架（例如Angular 7）。我宁愿花时间升级到角度的打字稿版本。我希望答案对其他人有用。
其他与Stackoverflow相关的问答：
Vue.JS - micro frontend approach Micro frontend architecture advice
微前端的例子
关于微前端的资源清单
我认为你的问题的解决方案存在于Angular Elements。这是非常酷，由有远见的团队提供。
Angular Elements允许您将Angular组件打包为custom web elements，它是Web平台API的Web组件集的一部分。 Web组件是帮助创建可重用的encapsulated elements的技术。现在，它包括影子DOM，HTML模板，HTML导入和自定义元素。自定义元素技术为Angular Elements提供动力。
以下是一些参考链接，您可以从中了解有关Angular Elements的更多信息。
https://angular.io/guide/elements
https://www.telerik.com/blogs/getting-started-with-angular-elements
谢谢！
我相信Angular 6 Elements将成为非角度应用程序的唯一选择。这是我所知道的唯一允许组件在角度之外执行的方法。
为了保持样式封装，您可以使用css前缀：
:host
在组件的.css或.scss文件中。
如果你可以摆脱非角度要求，我会推荐Angular CDK PortalHost和DomPortalHost。