因重新升级了系统,一步步搭建react-native环境。

  • 1、安装Homebrew

  打开终端命令->ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

  (注:ruby命令苹果系统自带的,如果没有则需安装。)

  等待安装完成,输入 brew -v是否已经安装成功。

  • 2、安装curl

  使用brew来安装curl(也可以使用wget)->brew install curl(或brew install wget)

  • 3、安装nvm并授权

  使用curl安装->curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash 如图:

  提示~/.bash_profile文件不存在,先进入目录->cd ~ 创建文件->touch .bash_profile(如果存在则不用创建),

  然后打开文件->open .bash_profile。

  然后把上面提示export开始到=>中间的的信息内容放到文件内,保存。退出终端重新打开。  

  检测->nvm  --version是否安装成功(出现版本号则表示已经成功。)

  • 4、安装node.js

  使用nvm安装->nvm install node && nvm alias default node 如图:

  nvm 默认是从http://nodejs.org/dist/下载的, 国外服务器, 连不上则会失败,可以多试几次,如果总是失败。

    试试用brew安装->brew install node

    安装成功完后,检测是否成功。
  • 5、安装watchmam和flow
 
    使用brew安装->brew install watchman
    使用brew安装->brew install flow
 
  • 6、更新最新版本。
 
    时时检测以使应用程序保持最新状态-> brew update && brew upgrade
 
  • 7、装react-native
 
    使用npm全局安装->npm install -g react-native-cli(npm命令是在安装node自动安装好的)
    装好后检测下是否成功。->react-native -vision
 
  • 8、创建第一个应用
    装好xcode,进入存放的目录->cd /Users/GloomHu/desktop
    由于网络问题init项目时会失败。把npm切到国内来
       ->npm config set registry https://registry.npm.taobao.org
    ->npm config set disturl https://npm.taobao.org/dist

    使用react native创建第一个应用->react-native init GloomHuProject(GloomHuProject是项目名称)
 
        等待几分钟就完成。如图:
                   
 
    找到项目生成的目录用xcode打开ios/GloomHuProject.xcodeproj,随意修改index.ios.js看看内容,直接run运行。如图:
                    
 

一步步搭建react-native环境(苹果OS X)的更多相关文章

  1. windows环境下搭建react native环境

    一.基础软件1.安装jdk-1.8.0_922.安装android studio-2.1.2(文件大小为1.2G的那个)3.安装node.js(目前最新是6.3.0)4.安装git-2.9.05.安装 ...

  2. 海马玩模拟器——搭建React Native环境

    Visual Studio Emulator for Android 模拟器国内这网络环境不太用,所以使用海马玩模拟器,给大家推荐一下! 下面开始配置环境: 1)下载1.8+JDK,配置JDK环境参考 ...

  3. VSCode 搭建 React Native 环境

    安装 React Native Tools 在插件市场搜索 react 找到 React Native Tools 进行安装: 创建的react-native的工程拖入vscode中 点击F5即可运行 ...

  4. 1、在MAC上搭建React Native开发环境

    @import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...

  5. 搭建react native所遇到的坑

    一.所遇问题 在搭建react native环境中,遇到执行react native  run-android命令出现如下问题 Could not resolve all dependencies f ...

  6. 史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用

    史上最详细Windows版本搭建安装React Native环境配置   2016/01/29 |  React Native技术文章 |  Sky丶清|  95条评论 |  33530 views ...

  7. Mac中搭建 iOS 的 React Native 环境

    手把手教你在Mac中搭建iOS的 React Native环境 http://www.cnblogs.com/damnbird/p/6074607.html 准备工作 1.你需要一台Mac电脑..(这 ...

  8. 搭建React Native开发环境

    搭建React Native开发环境 本文档是Mac下搭建的环境,针对的目标平台不同,以及开发 iOS 和 Android 的不同,环境搭建也有差异. Github地址:https://github. ...

  9. 史上最全Windows版本搭建安装React Native环境配置

    史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...

  10. Mac系统下React Native环境搭建

    这里记录一下在Mac系统下搭建React Native开发环境的过程: 1. 安装HomeBrew: /usr/bin/ruby -e "$(curl -fsSL https://raw.g ...

随机推荐

  1. AngularJS之初级Route【一】(六)

    前言 这一节我们来讲讲AngularJS中的路由以及利用AngularJS在WebAPi中进行CRUD.下面我们一起来看看. 话题 当我们需要进行路由映射时即用到$route服务,在AngularJS ...

  2. Using Headless Mode in the Java SE Platform--转

    原文地址: By Artem Ananiev and Alla Redko, June 2006     Articles Index This article explains how to use ...

  3. 站在巨人的肩膀上---重新自定义 android- ExpandableListView 收缩类,实现列表的可收缩扩展

    距离上次更新博客,时隔略长,诸事繁琐,赶在去广州答辩之前,分享下安卓 android 中的一个 列表收缩 类---ExpandableListView 先上效果图: 如果想直接看实现此页面的代码请下滑 ...

  4. 清除inline-block元素之间的空白

    一个元素如果被设置为display:inline-block,那么这个元素将表现为行内块的性质.被设为行内块的元素 对内(子元素)表现为块级框,具体为可以设置高度宽度,可以设置垂直margin和pad ...

  5. 【类库】私房干货.Net数据层方法的封装

    [类库]私房干货.Net数据层方法的封装 作者:白宁超 时间:2016年3月5日22:51:47 摘要:继上篇<Oracle手边常用70则脚本知识汇总>文章的发表,引起很多朋友关注.便促使 ...

  6. 1Z0-053 争议题目解析134

    1Z0-053 争议题目解析134 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 134.You are managing an Oracle Database 11g datab ...

  7. iOS_MJRefrash的详解以及使用

    MJRefresh Github 效果动态图来这里看吧 该博客Demo下载地址 一. MJRefresh的类解释. 1.MJRefreshComponent              所有刷新控件的基 ...

  8. 【集合框架】JDK1.8源码分析之HashMap(一)

    一.前言 在分析jdk1.8后的HashMap源码时,发现网上好多分析都是基于之前的jdk,而Java8的HashMap对之前做了较大的优化,其中最重要的一个优化就是桶中的元素不再唯一按照链表组合,也 ...

  9. jQuery-1.9.1源码分析系列(十一) DOM操作

    DOM操作包括append.prepend.before.after.replaceWith.appendTo.prependTo.insertBefore.insertAfter.replaceAl ...

  10. CSS-float详解,深入理解clear:both[转+部分原创]

    首先要知道,div是块级元素,在页面中独占一行,自上而下排列,也就是传说中的流. 可以看出,即使div1的宽度很小,页面中一行可以容下div1和div2,div2也不会排在div1后边,因为div元素 ...