下载掌阅APP，畅读海量书库
立即打开
下面来观察一下这个新建的hello-world应用。
应用的代码都位于src文件夹中。所有的Angular组件、模板、样式、图片，以及用户的应用所需的任何东西都在这里。除这个文件夹外的文件都是为构建应用提供支持用的。
src目录结构如下：
其中，各文件的用途见表2-1。
表2-1 src目录中各文件用途说明
src文件夹是项目的根文件夹之一。其他文件是用来帮助用户构建、测试、维护、文档化和发布应用的。它们存在于根目录下，和src文件夹平级。具体结构如下：
其中，各文件的用途见表2-2。
表2-2 根目录中各文件用途说明
Angular CLI、Angular应用及Angular本身都依赖于很多第三方包所提供的特性和功能。这些都是npm包。
可以使用“npm”命令来安装这些npm包，“npm”命令也是一个Node.js应用。这些npm包被放置在node_modules目录下，可能会包含10个、上百个甚至上千个文件。
使用“npm”命令所安装的包都记录在package.json文件中。当使用Angular CLI的“ng new”命令时，会给项目创建一个默认的package.json文件。这个package.json文件中带有一些起步包，这些包可以很好地协同，并可用于大量常见的应用场景。
以下是hello-world应用的package.json文件内容。
在package.json文件中可以看到，Angular应用主要分为以下两类包。
1.dependencies 包
dependencies包下包括以下内容。
● Angular包：Angular的核心和可选模块，它们的包名以“@angular/”开头。
● 支持包：那些Angular应用运行时必需的第三方库。
● 腻子脚本：负责抹平不同浏览器的JavaScript实现之间的差异。
2.devDependencies 包
devDependencies包下包括以下内容。
●@angular/cli：Angular的命令行工具。
●@angular/compiler-cli：Angular的编译器，它会被Angular CLI的“build”和“serve”命令调用。
●@angular/language-service：Angular的语言服务会分析组件模板，并且提供类型信息和错误信息，那些支持TypeScript的编辑器可以使用它们来提升开发体验。比如，Visual Studio Code的Angular语言服务扩展包。
●@types/...：第三方库（比如Jasmine和Node.js）的TypeScript类型定义文件。
● codelyzer：专用于Angular应用的linter，它的规则适用于Angular的风格指南。
● jasmine-...：Jasmine测试库的支持包。
● karma-...：Karma测试运行器的支持包。
● protractor：适用于Angular应用的端到端（e2e）框架。基于WebDriverJS构建。
● ts-node：TypeScript的运行环境，以及在Node.js环境下使用的REPL。
● tslint：一个静态分析器，用来检查TypeScript代码的可读性、可维护性和功能方面的错误。
● typescript：TypeScript语言服务，包括TypeScript编译器tsc。
提示：
随着应用的成长，你可能还会往package.json文件中添加更多包，同时也可能会移除一些包。