因重新升级了系统,一步步搭建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之WebAPi上传(十)

    前言 前面一系列我们纯粹是讲AngularJS,在讲一门知识时我们应该结合之前所学综合起来来做一个小的例子,前面我们讲了在MVC中上传文件的例子,在本节我们讲讲如何利用AngularJS在WebAPi ...

  2. 关于JqueryEasyUI集合Kindeditor

    写在前面 上一篇<初试JqueryEasyUI(附Demo)>: 在上一篇说过,下面要试下easyui集合编辑器,关于编辑器网上有很多,ckeditor.ueditor.kindedito ...

  3. 1Z0-053 争议题目解析154

    1Z0-053 争议题目解析154 考试科目:1Z0-053 题库版本:V13.02 题库中原题为: 154.A database is running in ARCHIVELOG mode and ...

  4. 初识openstack

    <1>虚拟化技术的功能和特点 多个虚拟机运行在一台物理服务器上,虚拟机之间共享物理资源,虚拟机可以分别安装不同的操作系统,应用程序相互隔离. 虚拟化技术的优势:虚拟机的操作系统和应用程序不 ...

  5. 关于WEB Service&WCF&WebApi实现身份验证之WebApi篇

    之前先后总结并发表了关于WEB Service.WCF身份验证相关文章,如下: 关于WEB Service&WCF&WebApi实现身份验证之WEB Service篇. 关于WEB S ...

  6. asp.net 验证控件

    前台文件 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1. ...

  7. QT5.1 调用https

    以VS开发为例.因为https访问需要用到SSL认证,而QT默认是不支持SSL认证,所以在使用之前必须先做一些准备工作: 需要安装OpenSSL库: 1.首先打开http://slproweb.com ...

  8. C#多线程编程

    一.使用线程的理由 1.可以使用线程将代码同其他代码隔离,提高应用程序的可靠性. 2.可以使用线程来简化编码. 3.可以使用线程来实现并发执行. 二.基本知识 1.进程与线程:进程作为操作系统执行程序 ...

  9. mvc实现上传视频预览

    上个项目中用到了上传视频,本来打算用百度的webuploader做的,但是webuploader可能有个毛病就是不能上传太大的东西. 于是乎,只能换个方法做了啊,看了半天最终决定用传统的uploade ...

  10. CSS3橙色的星球绕轨道公转动画

    效果:http://hovertree.com/texiao/css3/24/ 效果图: 代码如下: <!DOCTYPE html> <html lang="zh" ...