1.3 搭建react native开发环境
“磨刀不误砍柴工”，在正式开发react native应用之前，需要先搭建好react native的开发环境。搭建react native开发环境有以下几个主要步骤。
原生开发工具：ios开发使用xcode，android开发使用android studio and sdk tools。
?注意：ios开发是依赖于macos的，所以使用react native开发ios应用需要使用macos。
1.3.1 安装原生开发工具——android
由于react native应用仍然是基于原生平台（参考本书1.1.节react native的结构），所以搭建react native的前提是安装原生开发工具。
图1.10 查看jdk安装是否成功及java版本号
?提示：国内网络情况下访问android相关网站较慢，所以读者可以搜索国内的android资源网站进行下载。
（3）第一次打开android studio时，需要在“设置”中配置android sdk tools的路径android sdk location，如图1.11所示。
（4）成功配置android sdk tools的路径之后，还要下载和安装sdk相关工具，如图1.12所示。
（5）此时，还需要将android sdk tools的路径加入到系统变量path中。
?提示：无论是jdk，还是android sdk tools，以及以后要安装的其他开发工具（如node.js、npm、react native等），根据实际情况，都需要添加到系统变量path中，否则会发生找不到该工具或命令的错误。当然，有时候安装程序会自动完成该配置，请读者知悉。
对于linux或macos系统，将下面的配置添加到~/.bashrc文件中。
export android_home=/path/to/android/sdk/tools
export path=${path}:${android_home}/tools
export path=${path}:${android_home}/platform-tools
对于windows系统，将下面的路径添加到环境变量path中。
android sdk tools文件夹路径。
android sdk tools文件夹里的tools文件夹路径。
android sdk tools文件夹里的platform-tools文件夹路径。
添加效果如图1.13所示。
图1.13 添加android sdk tools路径到windows系统变量path
?提示：如果正确配置之后，还是找不到android sdk tools工具或命令，可以尝试重新加载环境变量或重启终端。
1.3.2 安装原生开发工具——ios
首先需要再次提醒读者的是，使用react native开发ios应用是需要macos的，所以经济条件允许的话，最好购置一台mac电脑。只有在使用react native同时开发ios和android应用，才能发挥出react native跨平台的优势。
xcode的安装比较简单，在macos中登录apple id后，打开app store搜索xcode安装即可，如图1.14所示。
?注意：请务必在apple官网或app store下载xcode安装程序。2015年9月发生的轰动国内的xcodeghost事件，起因就是因为开发者下载并使用了非官方被植入非法代码的xcode安装程序。
图1.14 在app store中查找并安装xcode
1.3.3 安装node.js
?提示：推荐读者使用最新的lts版本，因为官方维护的周期较长，功能和稳定性较好。
（1）下载完成后双击安装包进行安装，如图1.15所示。
（2）根据安装向导提示，单击相应的“继续”或“同意”按钮，最后单击“安装”按钮进行安装。安装成功后，如图1.16所示。
在图1.16中，需要注意以下有用的信息。
node.js的安装路径：/usr/local/bin/node。
npm的安装路径：/usr/local/bin/npm。
保证/usr/local/bin添加到了系统变量$path中。
?提示：node.js在windows系统上的安装过程和macos相同，并且node.js的windows安装包默认还会自动将安装好的工具和命令的路径添加到环境变量path中。
（3）通过如图1.17所示方法验证安装是否成功。
图1.17 查看node.js、npm安装路径及版本号
1.3.4 安装react native
在node.js及npm安装好之后，终于可以进入主题：安装react native了。安装react native就是安装react native的命令行工具，由于前面已经安装好node.js及npm，安装react native就非常简单了。使用如下命令即可：
npm install -g react-native-cli
?提示：如果使用npm下载速度较慢的话，可以使用cnpm代替npm，即cnpm install -g react-native-cli。
安装完成后，可以通过如图1.18所示方法验证是否成功。
图1.18 查看react-native命令行工具帮助和版本号
1.3.5 安装其他辅助工具
安装完以上所有工具后，理论上已经可以开始react native开发之旅了，但在实际开发中，还有一些必备的高效生产工具，在这里推荐读者也安装一下。
1．nuclide开发工具
官方出品，对react native新特性及开发、调试支持更好。
基于atom，拥有了庞大的第三方插件库。
nuclide的安装过程如下：
打开atom，选择settings|install packages命令，搜索并安装nuclide，如图1.19所示。
图1.19 安装nuclide
2．chrome浏览器
chrome浏览器是react native开发的远程调试工具，安装比较简单，这里就不介绍了。在chrome浏览器安装完成后，还需要在chrome的应用商店中安装这款chrome插件：react developer tools，如图1.20所示。
?提示：和android的问题一样，国内网络情况下访问chrome相关网站也较慢，所以读者可以搜索国内的其他资源网站进行下载和安装。
图1.20 安装chrome插件react developer tools
3．watchman工具
brew update
brew install watchman
?小知识：homebrew是macos平台上的软件包管理工具，拥有安装、卸载、更新、查看和搜索软件包等很多实用的功能。
linux系统需要下载源码自己编译安装，方法也很简单，安装命令如下：
cd watchman
git checkout v4.7.0 # the latest stable release
./autogen.sh
./configure
make
sudo make install