大型组织的大规模前端架构( 二 ) 嗨！我想与您讨论如何在大型

3.技术栈在Frontend项目中，技术堆栈的组件可以是：构建该项目所基于的框架，主要语言，样式处理器，数据层（例如Apollo），状态管理，测试，代码整理，构建系统等。
当然，所有规则中都有例外。在本主题中，我还想说一句，有时某些技术非常适合某些特定项目，即使这些技术不属于全球公司范围的技术体系。但是，每当这种想法脱离公司技术堆栈时，您都应该三思而后行，因为支持此类事务的成本非常高，因此收益必须非常可观。
让我们在这里提及一些通用技术堆栈，该堆栈现在可以适合大多数项目（当然，它仅涵盖实际技术堆栈的一部分，但对于某人来说可能是个不错的起点）：
· React
· Typescript
· Apollo
· StyleSheet
· React Routing
· 创建React应用
文章插图
> Stack
在我们为公司定义技术栈并达成共识之后，还有其他非常重要的成功支柱。
首先-我们需要将技术堆栈记录到文档中。该文档应该在工程师之间很好且轻松地共享，因此他们可以始终相互之间提供链接作为证明。
其次-我们应该再次使用已定义的技术堆栈，写下并共享如何启动和引导新项目的文档。
文章插图
> Tech Stack
概要：
在实施并采用了上面提到的所有内容之后，您应该在组织中拥有所有项目以共享同一技术堆栈。理想情况下，没有任何差异。并非理想-差异不大。如果我们还添加了上一节，则代码，文件夹，文件结构在您的项目中也应该几乎相同。因此，在任何项目中导航都是一项非常简单的任务。好
4.工具这个话题很重要。现在，我们几乎在所有地方都使用了一些附加工具—用于整理，构建应用程序， CI ，组件生成器等等。因此，这就是为什么我能为我们的项目选择正确的工具的原因。这至关重要。好的工具还是不好的工具（或者根本没有工具），就像自动化测试与手动测试之间的比较一样。
我们之前在前面的部分中讨论过技术堆栈和代码结构，并提到我们需要编写大量文档来使人们关注它们。但是正确的工具集可以使您有机会按照公司的准则进行自动化。
例如，如果您具有指定的编码样式，则可以为用户提供整理工具集，默认情况下，整理工具集遵循这些规则。如果您具有已定义的技术堆栈，那么良好的CLI工具将为您提供使用现有技术堆栈中的特定技术来引导新项目的机会。
让我们尝试讨论工具可以覆盖前端体系结构的哪些部分：
· 代码样式和结构正如我们之前讨论的那样，可以通过工具轻松实现自动化
· 项目自举您无需提出新的项目结构，手动安装所需的所有软件包等。
· 组件生成大多数时候，应用程序中的某个组件甚至都不包含单个文件，因此文件创建，链接/导入它们可能要花费一些时间，因此可以实现自动化。
· 启动和构建当然，最显而易见的要自动化的事情是如何构建或启动应用程序。
· 测试为测试构建应用程序并实际运行所有类型的测试（单元，集成等）的过程。
· 依赖管理我们知道，现在大约80％的代码是依赖。因此，我们需要让他们保持最新状态，并且要在一家大型公司中进行管理并非易事。
· 跨项目的依赖关系我们的项目很可能不是孤立地工作，可能依赖于其他项目，或者依赖于其他项目，因此我们可能需要一些工具来简化链接它们的过程，并结合多个项目进行开发（例如Bit）等。
· CICI是我们日常工具集的重要组成部分，自动化和统一对您的组织可能是一项非常有益的工作。
如果您不想开发自己的新工具集，我可以推荐NX工具集，它是最有趣的候选对象之一。同样， Babel的创建者似乎也执行了类似的解决方案，您可能需要检查一下-罗马。这些工具并不能涵盖所有内容，而是我们所讨论内容的很大一部分，因此可以作为一个很好的起点。
文章插图
> Tooling
概要：
试想一下，在我们完成所有部分的采用之后，我们的体系结构将变得多么伟大
文章插图
每个项目都是相同的，并由统一工具集维护和管理。每个项目都可以以相同的方式启动和构建。新的组件在相同的位置使用相同的命名准则生成。