Angular文件结构
以Angular/cli创建的项目目录为例。
- e2e文件 端对端测试。
- src 主要的开发代码的存放位置。
- angular.json angular-cli 配置。
- karma.conf.js 单元测试文件。
- package.json npm包管理配置。
- Protractor.conf.js 是测试的相关文件
- README.md cli说明。
- Tsconfig.json Typescript配置。
- Tslint.json Typescript代码格式校验文件。
SRC目录下结构：
- app 根模块、根组件。
- assets 放图片、字体文件等等。
- environments 配置环境。生产环境、开发环境、测试环境、
- index.html 单页应用的唯一页面。
- main.ts 整个项目的入口脚本。
- polyfills.ts 兼容老版本的浏览器。
- styles.css 全局样式配置。
- test.ts 测试用例的ts。
源码结构分析：
- @angular/core 存放核心代码，如变化监测机制、依赖注入机制、渲染等，核心功能的实现，装饰器也会存放到这个模块。
- @angular/common: 存放一些常用的内置指令和内置管道等。
- @angular/forms：存放表单相关内置组件与指令。
- @angular/http：存放网络请求相关的服务等。
- @angular/router: 存放路由相关。
- @angular/platform-
: 存放引导启动相关工具。
启动过程
1、 在main.ts中platformBrowserDynamic 是动态引导项目加载。会把项目指引到AppModule中去。
2、 AppModule中的bootstrap元数据，会指定模块的根组件也就是 app.component.ts
3、 根组件暴露出 select选择器为app-root。而index.html中加载了标签。从而实现了页面的显示。