创建angular项目,angular环境搭建

　　创建angular项目,angular环境搭建

　　角度项目怎么组织？下面这篇文章整理分享了五个管理棱角项目的实用技巧，希望对你有所帮助！

　　随着新功能的发布，Web apps的体量越来越大。在公司DevOps的过程中，这种发布变更每天都在发生。【相关教程推荐：《angular教程》】

　　在如此高速的发布周期中，代码很快就会变得笨拙。尤其是基于Javascript的项目，比如NextJS或者Angular。

　　这里是我们管理Angular项目的五个最佳实践，以实现最大的可读性、可维护性和可扩展性。

1. 准守单一职责原则

　　许多单个应用程序核心是具有臃肿的类的代码库。本质上，这些臃肿的程序很难维护。从某种意义上说，它们是如此脆弱，以至于改变一行代码就可能对整个程序产生灾难性的影响。单一责任原则可以防止这些问题。

　　单一责任原则意味着一个组件有且只有一个功能。

　　使用这种方法构建应用程序将会产生一个模块化的框架，在这个框架中，应用程序通过这些代码块串联起来。

　　使用这种方法可以使程序更易于阅读和维护。还能很好地定位应用中特定功能。

　　为了确保您的代码能够满足这一要求，您可以问自己一个问题：这段代码是做什么的？如果您的答案包含关键字and，那么您需要将代码重构为具有单一职责的代码。

　　构建角度应用程序并扩展它们是一项持续的工作。在不断的实践中，使用单一责任的原则来组织你的项目会使你的应用程序变得干净、易读和易维护。

2. 绑定代码到模块中

　　模块在角度上是单一原理的实现。在Angular中，每个模块代表一个独立的功能。

　　Angular提供了几种类型的模块来指定如何对它们进行逻辑分组或组织。

　　Core

　　核心模块是一个NgModule，用于实例化应用程序和加载核心功能以供全局使用。

　　因此，任何单例服务都应该在核心模块中实现。页眉、页脚或导航栏都是这种类型的模块。

　　每个应用程序只有一个实例的所有服务(单例服务)都应该在核心模块中实现。例如认证服务或用户服务。

　　Feature

　　功能模块代表构建应用程序功能的代码。例如，在一个在线购物应用程序中，我们将拥有向购物车添加商品的功能和一个单独的支付模块。

　　Shared

　　共享模块由可以组合起来创建新功能的模块组成。例如，搜索功能可用于平台中的多种功能。

　　以这种方式构建代码使得事情更容易定位，并且增加了代码可重用性的机会。

3. 组织 SCSS 文件

　　如果不按照一般的结构，样式文件很快就会变得杂乱无章。模式7-1使用7个文件夹和1个文件的一般实践模式如下：

　　App-项目的主文件夹

　　Abstract-抽象部分，包含所有变量、混合和类似组件

　　Core-包含整个网站的排版、重置和样板代码。

　　Components-Styles包含为网站创建的所有组件，如按钮、标签和图案。

　　Layout-包含定义网站布局所需的文件，如页眉和页脚。

　　Pages-包含每个特定的页面样式

　　Vendors-这个可选文件夹适用于项目的引导框架，比如bootstrap。

　　在每个文件夹中创建一个新的all.scss文件，其中包含该特定文件夹的所有替换。

4. 将私有服务放到组件中

　　许多服务被设计为在全球范围内运行。然后，在某些情况下，一个组件需要一个服务。传统的编码组件实践推荐单一责任原则。

　　在这种方法中，服务和组件是作为单独的项目编写的。

　　但是，考虑一下，如果你进入锅里，删除这些服务的组件，会发生什么？你最后得到的是死代码，只会让仓库更加混乱。在这种情况下，最佳实践是将服务放在组件内部。

　　这样，维护组件和服务就更容易了。

5. 简化导入的 Angular 最佳实践

　　嵌套文件结构本质上比所有代码文件都在一个目录中的平面文件系统更容易导航。

　　但是，使用项目的方法，项目的文件结构可能会变得相当复杂。尽管这使得定位代码变得更加容易，但是在编写import语句时却是一个挑战。

　　当目录结构开始超过三或四级时，import语句会变得非常长，难以阅读。

　　为了解决这个问题，我们可以在tsconfig.json文件中配置路径的别名。在这个文件中，有一个名为compilerOptions的数组。这是您在应用程序中配置的路径别名。

　　编译代码时，数组中定义的路径别名将被替换为真实路径。每个路径的值是一个包含实际路径和别名的键-值对对象。

　　构建角度应用程序并扩展它们是一项持续的工作。

　　有关编程的更多信息，请访问：编程视频！以上就是管理角项目的五个实用技巧(总结和分享)的详细内容。更多请关注我们的其他相关文章！