├── e2e 端到端测试(暂且不关心)
├── node_modules npm安装的第三方包
├── src 存放业务源码
├── .angular.json AngularCLI脚手架工具配置文件
├── .editorconfig 针对编辑器的代码风格约束
├── .gitignore Git仓库忽略配置项
├── karma.conf.js 测试配置文件(给karma用的,暂且不用关心)
├── package.json 项目包说明文件
├── README.md 项目说明文件
├── tsconfig.json TypeScript配置文件
└── tslint.json TypeScript代码风格校验工具配置文件(类似于 eslint)
//npm scripts介绍
…
“scripts”: {
“ng”: “ng”, 运行查看 Angular CLI 脚手架工具使用帮助
“start”: “ng serve”, 运行开发模式
“build”: “ng build —prod”, 运行项目打包构建(用于发布到生成环境)
“test”: “ng test”, 运行karma单元测试
“lint”: “ng lint”, 运行TypeScript代码校验
“e2e”: “ng e2e” 运行protractor端到端测试
},
…
main.js
- 描述:模块化启动入口
- 职责:加载启动根模块
AppModule
- 描述:项目根模块
- 职责:把组件、服务、路由、指令等组织到一起,设置AppComponent为根组件
import { BrowserModule } from ‘@angular/platform-browser’;
import { NgModule } from ‘@angular/core’;
import { AppRoutingModule } from ‘./app-routing.module’;
import { AppComponent } from ‘./app.component’;
import { FooComponent } from ‘./foo/foo.component’;
import { LoginComponent } from ‘./home/login/login.component’;
@NgModule({
//声明模块资源:组件、指令、服务
declarations: [
AppComponent,
FooComponent,
LoginComponent
],
//依赖模块
imports: [
BrowserModule,
AppRoutingModule
],
//指定应用程序的根级别需要使用的service
providers: [],
//指定启动组件
bootstrap: [AppComponent]
})
export class AppModule { }
AppComponent
- 描述:项目根组件
- 职责:替换掉 index.html 文件中的
app.component.spec.ts 单元测试文件,暂时不用管他