Angular2 JSON Schema Form 项目教程
1. 项目的目录结构及介绍
angular2-json-schema-form/
├── src/
│ ├── app/
│ ├── assets/
│ ├── environments/
│ ├── index.html
│ ├── main.ts
│ ├── polyfills.ts
│ ├── styles.css
│ ├── test.ts
│ ├── tsconfig.app.json
│ ├── tsconfig.spec.json
│ └── typings.d.ts
├── .editorconfig
├── .gitignore
├── .npmignore
├── .travis.yml
├── CHANGELOG.md
├── LICENSE
├── README.md
├── package.json
├── tsconfig.json
└── tslint.json
目录结构介绍
src/
:包含项目的源代码。app/
:包含Angular应用的组件、服务和其他模块。assets/
:存放静态资源文件,如图片、字体等。environments/
:包含不同环境下的配置文件。index.html
:应用的主HTML文件。main.ts
:应用的入口文件。polyfills.ts
:包含浏览器兼容性填充代码。styles.css
:全局样式文件。test.ts
:测试配置文件。tsconfig.app.json
:TypeScript应用配置文件。tsconfig.spec.json
:TypeScript测试配置文件。typings.d.ts
:TypeScript类型定义文件。
.editorconfig
:编辑器配置文件。.gitignore
:Git忽略文件配置。.npmignore
:npm忽略文件配置。.travis.yml
:Travis CI配置文件。CHANGELOG.md
:项目更新日志。LICENSE
:项目许可证。README.md
:项目说明文档。package.json
:npm包配置文件。tsconfig.json
:TypeScript配置文件。tslint.json
:TSLint配置文件。
2. 项目的启动文件介绍
main.ts
main.ts
是Angular应用的入口文件,负责启动应用。以下是 main.ts
的基本内容:
import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
if (environment.production) {
enableProdMode();
}
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
启动文件介绍
enableProdMode()
:在生产环境中启用生产模式。platformBrowserDynamic()
:使用JIT编译器启动Angular应用。bootstrapModule(AppModule)
:引导启动AppModule
模块。
3. 项目的配置文件介绍
tsconfig.json
tsconfig.json
是TypeScript的配置文件,定义了TypeScript编译器的选项。以下是 tsconfig.json
的基本内容:
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "es2020",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
]
},
"angularCompilerOptions": {
"fullTemplateTypeCheck": true,
"strictInjectionParameters": true
}
}
package.json
package.json
是npm包配置文件,定义了项目的依赖、脚本和其他元数据。以下是 package.json
的基本内容:
{
"name": "angular