React Native教程一步一步搭建React Native开发环境.docx

《React Native教程一步一步搭建React Native开发环境.docx》由会员分享，可在线阅读，更多相关《React Native教程一步一步搭建React Native开发环境.docx（7页珍藏版）》请在三一办公上搜索。

1、React Native教程一步一步搭建React Native开发环境 育知同创官网： React Native教程：一步一步搭建React Native开发环境 1 环境搭建 工欲善其事，必先利其器。首先，我们需要搭建开发环境(我们以后的文章和视频均是以Mac OS X系统为基础)。React Native主要依赖以下环境。 Mac OS X操作系统。 推荐使用Xcode 7.3.0或者更高版本。 安装Node.js v6.2.1或者最新版本。 利用Homebrew安装watchman和flow。 安装React Native 安装NVM 创建第一个HelloWorld程序 下面我们一步步

2、来安装开发环境。 1.1 安装Xcode 打开Mac电脑，打开App Store，在App Store中搜索Xcode，双击Xcode，输入apple id下载安装即可。 1.2 安装Node.js Node.js官网：https:/nodejs.org 打开Node.js官网： 育知同创官网： 下载v6.2.1版本，下载完成以后双击node-v6.2.1.pkg包进行安装。 从上图中中This package will install Node.js v6.2.1 and nam v3.9.3 into /usr/local/.这句话表明我们将会安装Node.js v6.2.1和npm 3.

3、9.3版本. 育知同创官网： 育知同创官网： 育知同创官网： 上图表示Node.js和npm都是安装在/usr/local/bin/路径下面。 1.3 利用Homebrew安装watchman和flow 育知同创官网： 打开终端，按照如下操作即可. 育知同创官网： 接下来通过brew安装watchman和flow. 现在万事具备，只欠东风。我们通过npm安装react-native-cli的命令行工具。在mac终端中输入如下命令，其中-g表示全局安装。 育知同创官网： 1.4 NVM安装 bogon:Desktop lucien$ git clone Cloning into nvm remo

4、te: Counting objects: 4718, done. remote: Compressing objects: 100% (6/6), done. remote: Total 4718 (delta 1), reused 0 (delta 0), pack-reused 4712 Receiving objects: 100% (4718/4718), 1.26 MiB | 85.00 KiB/s, done. Resolving deltas: 100% (2802/2802), done. Checking connectivity done. bogon:Desktop l

5、ucien$ cd nvm/ bogon:nvm lucien$ ls 育知同创官网： CONTRIBUTING.md README.markdown nvm-exec test LICENSE.md bash_completion nvm.sh update_test_mocks.sh Makefile install.sh package.json bogon:nvm lucien$ source nvm.sh bogon:nvm lucien$ nvm Node Version Manager Note: refers to any version-like string nvm und

6、erstands. This includes: full or partial version numbers, starting with an optional “v” (0.10, v0.1.2, v1) default (built-in) aliases: node, stable, unstable, iojs, system custom aliases you define with nvm alias foo Usage: nvm help Show this message nvm version Print out the latest released version

7、 of nvm nvm install -s Download and install a , -s from source. Uses .nvmrc if available reinstall-packages-from= When installing, reinstall packages installed in nvm uninstall Uninstall a version nvm use silent Modify PATH to use . Uses .nvmrc if available nvm exec silent Run on . Uses .nvmrc if av

8、ailable 育知同创官网： nvm run silent Run node on with as arguments. Uses .nvmrc if available nvm current Display currently activated version nvm ls List installed versions nvm ls List versions matching a given description nvm ls-remote List remote versions available for install nvm ls-remote List remote v

9、ersions available for install, matching a given nvm version Resolve the given description to a single local version nvm version-remote Resolve the given description to a single remote version nvm deactivate Undo effects of nvm on current shell nvm alias Show all aliases beginning with nvm alias Set

10、an alias named pointing to nvm unalias Deletes the alias named nvm reinstall-packages Reinstall global npm packages contained in to current version 育知同创官网： nvm unload Unload nvm from shell nvm which Display path to installed node version. Uses .nvmrc if available Example: nvm install v0.10.32 versio

11、n number nvm use 0.10 available 0.10.x release nvm run 0.10.32 app.js v0.10.32 nvm exec 0.10.32 node app.js PATH pointing to node v0.10.32 nvm alias default 0.10.32 a shell Note: to remove, delete, or uninstall nvm (usually /.nvm) bogon:nvm lucien$ nvm ls -remote N/A bogon:nvm lucien$ nvm ls - v6.2.

12、1 system default - node (- v6.2.1) node - stable (- v6.2.1) (default) stable - 6.2 (- v6.2.1) (default) iojs - N/A (default) Install a specific Use the latest Run app.js using node Run node app.js with the Set default node version on remove the $NVM_DIR folder just 育知同创官网： bogon:nvm lucien$ 1.5 创建项目 搭建好RN环境以后，我们来创建一个HelloWorld项目。见终端。 1.6 运行项目 育知同创官网： Command R运行 接下来关闭Xcode，注意：不要关闭终端和模拟器，用Sublime打开index.ios.js，编辑，保存，选中模拟器，重新按CommandR运行即可，无需重新打开Xcode运行。 育知同创官网： 本资料由育知同创教育整理，版权所有，翻版必究