怎么组织 Angular 项目？下面这篇文章为大家整理总结5个管理Angular项目的顶级技巧，希望对大家有所帮助！
随着新功能的发布，Web apps 体积越来越大。在公司里。 DevOps 在此过程中，这种发布变化每天都在发生。
在如此高速的发布周期中，代码很快就会变得笨拙。特别是基于基于这个周期。 JavaScript 开发的项目，如 NextJS 或者 Angular。
下面是我们正在管理的 Angular 项目中 5 实现最大可读性、可维护性和可扩展性的最佳实践。
1. 准守单一职责原则
许多单个应用程序的核心是臃肿的代码库。本质上，这些臃肿的程序很难维护。从某种意义上说，它们非常脆弱，如此脆弱，以至于更改一行代码可能会对整个程序产生灾难性的影响。single responsibility principle 可以防止这些问题。
单一责任原则意味着组件具有并且只有一个功能。
用这种方法构建应用程序会产生一个模块化框架，其中应用程序通过这些代码块串联在一起。
使用这种方法可以使程序更容易阅读和维护。它还可以在应用程序中很好地定位指定的功能。【相关教程推荐:angular教程、编程教学】
为了确保您的代码能够满足这一要求，您可以问自己一个问题：这个代码是干什么的？如果你自己的回答包括在内 and 这个关键字，那么你需要把你的代码重构成一个单一责任的代码。
构建 Angular 应用程序和扩展是一种持续的练习。在不断的练习中，使用单一的责任原则来组织你的项目将使你的应用程序干净、可读和可维护。
2. 将代码绑定到模块中
Angular 中的 modules 是单一原则的实施。在实施中。 Angular 每个模块代表一个分离和独立的功能。
Angular 它提供了几种模块来指定如何对它们进行逻辑分组或组织。
Core
Core 模块是一个 NgModule，用于实例化应用并加载全局使用的核心功能。
因此，任何单项服务都应该在核心模块中实现。页头、页脚或导航栏都是这类模块。
所有具有每个应用程序并且只有一个例子的服务(单个服务)都应该在核心模块中实现。例如，身份验证服务或用户服务。
Feature
功能模块代表构建应用程序功能的代码。例如，在一个在线购物应用程序中，我们将有一个单独的模块，将商品添加到购物车和支付。
Shared
共享模块由可以组合创建新功能的模块组成。例如，搜索函数可以用于平台上的多个功能。
以这种方式构建代码，使事物更容易定位，并增加代码可重用性的机会。
3. 组织 SCSS 文件
如果不遵循一般结构，样式文件很快就会变得混乱。一般来说，最佳实践模式 7-1 使用该模式的模式 7 个文件夹和 1 如下文件所示：
App - 项目的主要文件夹
Abstract - 抽象部分包括所有变量、混合和类似组件
Core - 包括整个站点的排版、重置和样板代码
Components - 包括为网站创建的所有组件的样式，如按钮、选项卡和模式
Layout - 包括定义网站布局所需的文件，如页头和页脚
Pages - 包含每个特定的页面风格风格风格风格风格风格
Vendors - 本可选文件夹适用于项目的指导框架，如
bootstrap
在每个文件夹中新建一个包含特定文件夹的所有替代品 all.scss 文件。
4. 将私有服务放入组件中
许多服务都在设计范围内运行。然后，在某些情况下，一个组件需要一个服务。传统的编码组件实践推荐单一责任原则。
在这种方法下，服务和组件被写成单独的项目。
但是，考虑删除这些服务的组件会发生什么呢？你最终得到的是死代码，这只会使仓库更加混乱。在这种情况下，最好的实践是将服务放在组件中。
这样，更容易维护组件和服务。
5. 简化导入的 Angular 最佳实践
嵌套文件结构本质上比将所有代码文件放在目录中的平面文件系统更容易导航。
然而，随着项目的方法，项目的文件结构可能会变得相当复杂。虽然这使得定位代码更容易，但它在编写导入句子时具有挑战性。
当目录结构开始超过三个或四个级别时， import 句子会变得很长，很难阅读。
要解决这个问题，我们可以解决这个问题 tsconfig.json 文件中配置路径的别名。在这份文件中，有一个名字叫做 compilerOptions 数组。这是您在应用程序中配置的路径别名。
代码编译后，数组中定义的路径别名将被真实路径所取代。每条路径的值是一个包含实际路径和别名的键值对象。
构建 Angular 应用程序和扩展是一种持续的练习。
本文为翻译，采用意译的形式。原始地址：How to Organize Angular Project | TOP 5 tips
更多编程相关知识，请访问：编程视频！！
以上是管理Angular项目的五个最佳小技巧的详细内容，请关注AdminJS的其他相关文章！