2

到目前为止，我们只有一个 Angular 8 应用程序。但是现在我们必须创建一个新的管理应用程序，其 UI 将类似于现有应用程序（类似于登录组件、侧边栏、导航栏等中的类似 UI）。由于这两个应用程序将部署在两个不同的服务器上但彼此共享组件，因此我们决定将两个不同的源代码保存在一个具有共享组件库的 repo 下。

我们现有的应用程序是使用Jhipster生成的。

我发现以下两种方法对于维护两个不同的应用程序可能很有用。

我阅读了为 Angular 创建库的文章。但是，我找不到任何有关如何更改现有构建过程以构建两个不同应用程序的材料？我阅读的所有文章都有 Angular CLI 命令来构建不同的应用程序。由于我们已经将 webpack 作为捆绑器，我如何配置它来构建我的两个应用程序？基本上我所有的疑问都是关于如何扩展我们用来构建、测试和维护这两个不同应用程序的现有工具。

然后我阅读了有关 monorepo 模式的信息，并通过nrwl.io遇到了Nx。据我了解，它是 Angular CLI 之上的包装器，以支持 monorepo 模式，并附带维护这两个应用程序所需的所有工具。

所以我的问题是，当你只需要在两个应用程序之间共享代码时，monorepo 模式值得去吗？这是就开发的便利性与将现有应用程序转换为支持 monorepo 模式（设置工具，如Nx中的工具）所花费的时间而言，我读过这有点令人头疼。

4

1 回答 1

0

免责声明，我是 NX 的忠实粉丝。

你如何改变现有的构建过程来构建两个不同的应用程序？

不确定我是否可以验证下一个声明，但在过去，我相信 Angular 文档是围绕单个应用程序编写的。最近（v7 或 8）文档词汇表已围绕Workspaces进行了更新。可能是由于 NX 越来越受欢迎（自 Angular 6 之前，他们一直在开创 Angular 单体仓库的开发）？

开箱即用的 Angular CLI

由于您使用的是 Angular 8，因此您可以像使用 Angular CLI: 生成组件一样生成应用程序ng generate application admin-app。此外，ng build接受应用程序名称作为参数，因此您只需使用开箱即用的 Angular CLI 构建两个单独的应用程序即可。ng build public-app和ng build admin-app

但是，如果您在预先存在的应用程序（也称为使用 生成的应用程序ng new）中执行此操作，代码库可能会变得非常混乱，因为新应用程序将被放置在projects代码库内的目录中。你基本上会以 App-Ception 告终，我认为这是一个糟糕的主意。

有关于设置多项目工作区的官方指南。您基本上创建了一个空工作区，所有生成的应用程序都放置在项目目录中。

当您只需要在两个应用程序之间共享代码时，monorepo 模式是否值得一试？

这是主观的，两种方法（monorepo vs poly/microrepo）都有利有弊，但在我看来，答案肯定是肯定的。但老实说，如果没有 NX，我什至不会尝试它。

NX

NX 带来了很多东西。说它是 Angular CLI 的包装器实际上只是表面问题。它确实有一系列示意图，可以扩展/改进现有的 Angular CLI 示意图（ng generate app|component|lib等等。是示意图）。它还可以轻松集成更好的开箱即用工具（Jest > Karma；Cypress > Protractor）。它还有自己的 CLI 工具，可以解决 monorepo 结构引入的许多问题（看看他们的指南）

尝试将其合并到您现有的代码库中

根据他们的Getting Started Docs，您只需执行以下操作即可轻松尝试：

ng add @nrwl/workspace

于 2020-01-03T20:30:55.507 回答