Angular React Native 渲染器教程
react-native-rendererUse Angular and React Native to build applications for Android and iOS项目地址:https://gitcode.com/gh_mirrors/re/react-native-renderer
1. 项目的目录结构及介绍
/angular-react-native-renderer
├── src
│ ├── app
│ │ ├── components
│ │ ├── services
│ │ ├── app.module.ts
│ │ └── app.component.ts
│ ├── assets
│ ├── environments
│ ├── index.ts
│ ├── main.ts
│ └── polyfills.ts
├── package.json
├── tsconfig.json
└── README.md
- src: 包含项目的主要源代码。
- app: 包含应用程序的主要模块和组件。
- components: 存放应用程序的组件。
- services: 存放应用程序的服务。
- app.module.ts: 应用程序的根模块。
- app.component.ts: 应用程序的根组件。
- assets: 存放静态资源文件,如图片、字体等。
- environments: 存放不同环境下的配置文件。
- index.ts: 项目的入口文件。
- main.ts: 应用程序的启动文件。
- polyfills.ts: 包含浏览器兼容性填充代码。
- package.json: 项目的依赖管理文件。
- tsconfig.json: TypeScript 配置文件。
- README.md: 项目的说明文档。
2. 项目的启动文件介绍
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
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"module": "esnext",
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
]
}
}
- compileOnSave: 是否在保存文件时自动编译。
- compilerOptions: 编译器选项。
- baseUrl: 基础路径。
- outDir: 输出目录。
- sourceMap: 是否生成 source map 文件。
- experimentalDecorators: 是否启用实验性的装饰器功能。
- module: 模块系统。
- moduleResolution: 模块解析策略。
- target: 编译目标。
- typeRoots: 类型定义文件的目录。
- lib: 包含的库。
package.json
{
"name": "angular-react-native-renderer",
"version": "0.0.1",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/core": "~12.0.0",
"react-native": "~0.64.0",
// 其他依赖
},
"devDependencies": {
"@angular-devkit/build-angular": "~12.0.0",
react-native-rendererUse Angular and React Native to build applications for Android and iOS项目地址:https://gitcode.com/gh_mirrors/re/react-native-renderer