React Native环境搭建

1.3 环境搭建 (Mac OS)

1)安装Homblew，必要工具vpn

    通过终端运行命令

    ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

    安装完毕，运行执行 blew －v 查看版本号，确定是否安装成功

   2)安装nodes.js

     a.首先安装 nvm ,nvm使你可以可以同时安装多个版本的Node.js，并且在这些版本之间轻松切换。

         安装－ 终端命令输入curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.30.1/install.sh | bash

         这个过程其实就是 去https://github.com/creationix/nvm#installation 把一个  install script xi运行

        下载执行完毕后会提示你没有设置环境变量啥的，通过终端在根目录下建立一个 .bashrc 及./bash_profile

         加入下面内容

               export NVM_DIR="/Users/cbf/.nvm"

               [ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh"  # This loads nvm

               export ANDROID_HOME=~/Library/Android/sdk ＃ 这个是你的sdks环境变量

          然后进入 .nvm 文件夹下执行 ./install.sh 即可安装成功

          然后 nvm -v 查看是否安装成功

      b.安装node,终端安装命令

          nvm install node && nvm alias default node

用nvm ls-remote查看版本，指定版本号安装：

nvm install v0.12.18 && nvm alias default node

          安装完成后，通过 node 命令确定是否安装成功

  3)安装watchman

          在命令行中输入brew install watchman，我们推荐安装watchman，否则你可能会遇到一个Node.js监视文件系统的BUG。

  4)安装flow

          如果你希望使用flow来为js代码加上类型检查，那么在命令行中输入brew install flow来安装flow。

   5)OS开发环境准备

     需要xcode 7以上，我下载的事xcode7.2 ，需要os x 10.10.5 版本才能支持

   6)快速开始

      由于众所周知的网络原因，react-native命令行从npm官方源拖代码时会遇上麻烦。请将npm仓库源替换为国内镜像：

      终端－》

                       npm config set registryhttps://registry.npm.taobao.org

                       npm config set disturlhttps://npm.taobao.org/dist

                       npm install -g react-native-cli

      init 项目命令

      react-native init AwesomeProject  ＃新建一个项目

      不过这个时间太久，推荐使用下面网址的项目，解压后直接可以运行

http://bbs.reactnative.cn/topic/11/react-native%E4%B8%AD%E6%96%87%E7%BD%91%E5%AE%98%E6%96%B9%E5%8F%91%E5%B8%83%E5%AE%8C%E6%95%B4%E6%96%B0%E9%A1%B9%E7%9B%AE%E5%8C%85-%E6%97%A0%E9%9C%80init

 

   7）运行iOS应用

         $ cd AwesomeProject

          用XCode打开ios/AwesomeProject.xcodeproj并点击Run按钮。

          使用你喜欢的文本编辑器打开index.ios.js并随便改上几行。

          在iOS Emulator中按下⌘-R就可以刷新APP并看到你的最新修改！

          运行Android应用 ，干巴巴的，给大家上张图先

    8）运行android应用

安装android SDK ，下载地址： https://developer.android.com/studio/index.html

安装指导：https://developer.android.com/studio/install.html   安装可能会有写组件安装不成功，多retry几次。

          $ cd AwesomeProject

          $ react-native run-android

          使用你喜欢的文本编辑器打开index.android.js并随便改上几行

          按Menu键（通常是F2，在Genymotion模拟器中是⌘+M）然后选择 Reload JS 就可以看到你的最新修改。

          在终端下运行adb logcat *:S ReactNative:V ReactNativeJS:V可以看到你的应用的日志。

          windows 下安装环境未亲自过坑，大家可以参见一下博客尝试

          http://www.cnblogs.com/meteoric_cry/p/4874517.html 

 

 

参考：

http://blog.csdn.net/chenbifeng/article/details/51496548