Question

创建步骤

在 React Native 的主页上，你能看到以下的内容。

配置环境要求

1. OS X：目前只有 OS X 中能够安装使用 iOS 的开发环境，并且 Xcode 也只能运行在 Mac 上。

2．最新版的 Xcode 开发工具：在 Mac 的 App Store 上下载就可以。

3．推荐使用 Homebrew 来安装 node、watchman 和 flow。

4．使用命令行 brew install node 来安装 node。

5．使用命令行 brew install --HEAD watchman 来安装 watchman。我们推荐安装 watchman，否则你可能会需要一个 node 文件来监控开发中的 bug。

6．使用命令行 brew install flow，如果你要使用 flow 的话。

快速开始

1．使用命令行 npm install -g react-native-cli。

2．使用命令行 react-native init AwesomeProject。

3．使用命令行 cd AwesomeProject。

在新创建的文件夹 AwesomeProject 中：

1．使用 Xcode 打开 AwesomeProject.xcodeproj 文件并运行项目。

2．用你常用的文本编辑器打开 index.ios.js 文件，选中几行修改一下代码。

3．在 Xcode 中打开 iOS 模拟器，按下组合键 Cmd+R（两次）重新加载应用，来观察修改的效果。

恭喜你！你刚刚已经成功地修改并运行了你的第一个 React Native 应用。

应用程序分析

我们来仔细研究一下新创建的应用程序。

首先来看一下 AwesomeProject/下都包含着什么内容：

1．文件夹 AwesomeProject.xcodeproj

2．文件夹 iOS

3．文件 index.ios.js

4．文件夹 node_modules/

5．文件 package.json

为了让你能有一个全面的了解，这里会详细地说明一下运行 react-native 命令初始化 Awesome-Project 项目时都发生了什么事情。

- 新建了一个名为 AwesomeProject 的文件夹。

- 在这个文件夹中建立 package.json 文件。

- npm install --save react-native 命令开始运行，这个命令安装了 react-native 及其依赖，这些依赖放在 AwesomeProject/node_modules 文件夹中。在 AwesomeProjec-t/package.json 中声明 react-native，作为你的项目的依赖。

- 全局安装 react-native CLI（react-native 命令行）工具，并且将控制权交给本地的 CLI 工具，就是 AwesomeProject/node_modules/react-native/local-cli/cli.js 文件。

- 接下来执行 AwesomeProject/node_modules/react-native/init.sh 文件。这个文件是用来生成标准代码的脚本，比如 index.ios.js、iOS 文件夹中的 Objective-C 代码，以及 Awesome-Project.xcodeproj 文件夹中的 Xcode 项目配置。

我们已经看到，React Native 是基于 JavaScript 的。这些 JavaScript 代码在 index.ios.js 中组成一个真实的应用。

package.json 文件对于已经使用过 Node.js 的开发者来说并不陌生，它定义了我们项目的一些元数据。更重要的是，它声明了 react-native 作为我们项目的依赖。

node_modules 文件夹是 npm install 命令进行项目初始化时生成的。它包含 react-native 源代码、其他的 npm 依赖、大量的 JavaScript 和 Objective-C 代码。

初始化进程也提供了最基本的 Xcode 项目定义和一些附加的 Objective-C 样板代码，它们允许我们在 Xcode 中打开一个项目并运行一个应用，而不需要任何其他的附加条件。这些本来都应该是手动完成的，但是因为包含了很多流程化的内容，而且这些内容不管我们创建什么类型的应用都是需要的，所以就可以通过 react-native 来简化这些步骤。

如果要将第三方库整合到 React Native 项目中，请在根目录下增加 Podfile 文件。

Podfile 是一个类似于 package.json 的东西，它为 CocoaPods 做依赖管理，声明了 Objective-C 库的依赖。我们将在本书后面讨论更多有关它的细节。

可以看出，我们的 AwesomeProject 项目是一个综合的项目。它是一个 Xcode 项目，也是一个 NPM 项目。它是一个基于 JavaScript 的 React Native 应用，也包含了很多 iOS 胶水代码，用来让我们的 JavaScript 代码运行在 iOS 环境中。