原文链接: http://blog.csdn.net/xiangzhihong8/article/details/53914336

概述

前面我们介绍过在window环境下开发React Native项目,今天说说怎么在mac上搭建一个RN的开发环境。

配置mac开发环境

基本环境安装

1.先安装Homebrew:用于安装NodeJS和其他工具。 

注:Homebrew详解,对这个比较了解的略过,我也是用mac没多久,这里给小白普及下。 
Homebrew全称Homebrew is the easiest and most flexible way to install the UNIX tools Apple didn’t include with OS X。是一个包管理器,用于在Mac上安装一些OS X没有的UNIX工具(比如著名的wget),Homebrew将这些工具统统安装到了 /usr/local/Cellar 目录中,并在 /usr/local/bin 中创建符号链接。 
安装Homebrew:

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


然后一路回车 
 
最后出现success,就表示安装成功了。 

安装完成后,可以用brew doctor命令检测下是否有什么冲突的地方。关于Homebrew其他的介绍可以自行查看官网资料。

安装 Node.js

React Native 需要 NodeJS 4.0或更高版本,Homebrew的Node默认包是6.0版本的,所以直接安装即可:

 brew install node
  • 1

安装React Native 命令行工具npm

之前我们说过npm是一个包管理工具,它是用来管理node的,详细介绍请看npm详解 
命令行工具可以轻松创建和初始化工程:

npm install -g react-native-cli

注:如果出现错误 :EACCES: permission denied,使用命令: sudo npm install -g React-native-cli.

安装Yarn

Yarn是Facebook提供的替代npm的工具,可以加速node模块的下载。React Native的命令行工具用于执行创建、初始化、更新项目、运行打包服务(packager)等任务。

npm install -g yarn react-native-cli

其他建议安装

Watchman

Whtchman是Facebook开发的一个检测文件系统变化的工具,在RN开发中可以检测js文件等是否有变化,从而达到保存及编译的效果。这个在windows中也有,个人觉得可装也可以不装,直接手机上reload也是可以的。

 brew install watchman

Flow

静态类型检查工具

brew install flow

Nuclide

Facebook推出的一款React Native集成开发环境(IDE),不过我不太喜欢,我一般用webstorm+Android/ios 的ide。

快速开发React Native

每次学习一门新的语言,我们总是总喜欢来一个helloWord。

react-native init HelloWord

cd HelloWord 

react-native run-ios

注:也可以用Xcode打开iOS/HelloWord.xcodeproj 并点击Run按钮。

小提示:react-native命令行从npm官方源拖代码时会遇上麻烦。请将 npm仓库源替换成淘宝的:

 npm config set registry https://registry.npm.taobao.org --global

npm config set disturl https://npm.taobao.org/dist --global

关于在mac上怎么搭建Android的运行环境这里不在讲解,大家可以看看我之前的文章React 和Android的整合,这篇文章也是补了之前RN在windows环境下开发,而没有在mac下开发,后面我们将讲解怎么在mac上开发一款RN应用。

[转] 在Mac上搭建React Native开发环境的更多相关文章

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

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

  2. 在Mac上搭建React Native开发环境

    概述 前面我们介绍过在window环境下开发React Native项目,今天说说怎么在mac上搭建一个RN的开发环境. 配置mac开发环境 基本环境安装 1.先安装Homebrew:用于安装Node ...

  3. Mac下搭建react native开发环境

    安装必需软件 Homebrew Homebrew, Mac系统的包管理器,用于安装NodeJS和一些其他必需的工具软件. /usr/bin/ruby -e "$(curl -fsSL htt ...

  4. 搭建React Native开发环境

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

  5. React Native开发 - 搭建React Native开发环境

    移动开发以前一般都是原生的语言来开发,Android开发是用Java语言,IOS的开发是Object-C或者Swift.那么对于开发一个App,至少需要两套代码.两个团队.对于公司来说,成本还是有的. ...

  6. 在MAC上搭建python数据分析开发环境

    最近工作转型到数据开发领域,想在本地搭建一个数据开发环境.自己有三年python开发经验,马上想到使用numpy.scipy.sklearn.pandas搭建一套数据开发环境. ubuntu的环境,百 ...

  7. 【RN - 基础】之Windows下搭建React Native开发环境

    前言 React Native由Facebook公司于2015年F8大会上开源,其主张“Learn once, write everywhere”.React Native的核心设计理念是:既拥有Na ...

  8. react-native —— 在Mac上搭建React Native Android开发环境

    需要:JDK,Android SDK,Node.js   1.安装JDK 去Java官网下载列表选择Mac OS X x64版   2.安装Android SDK 虽然现在谷歌推荐使用Android ...

  9. 搭建基本的React Native开发环境

    步骤如下: 1.安装HomeBrew,命令如下: 在终端输入命令:$ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Home ...

随机推荐

  1. 详述Centos中的ftp命令的使用方法

    ftp服务器在网上较为常见,Linux ftp命令的功能是用命令的方式来控制在本地机和远程机之间传送文件,这里详细介绍Linux ftp命令的一些经常使用的命令,相信掌握了这些使用Linux 进行ft ...

  2. php函数总结(闭包函数,匿名函数)

    php函数总结 1.普通函数 2.变量函数 function myfun($a) { echo $a; } $b = "myfun"; $b("test"); ...

  3. Spring Cloud Zuul 网关的分布式系统中整合Swagger(转)和 zuul跨域访问问题

    首先恭喜自己终于找对了努力的方向,很荣幸能在公司接触到微服务架构,也很高兴公司一个大佬哥们愿意带我,他技术确实很牛逼,我也很佩服他,前后端通吃,干了六年能有这样的水平.最近跟着在搞微服务架构,给我分配 ...

  4. macOS 安装安卓模拟器 并用charles抓包

    mac上面安装安卓模拟器并能使用charles抓包软件调研 一.Genymotion 1.先下载Virtua Box虚拟机 https://www.virtualbox.org/wiki/Downlo ...

  5. MapReduce中的排序(附代码)

    在直接学习hadoop的排序之前还要了解一些基本知识. Hadoop的序列化和比较接口 Hadoop的序列化格式:Writable Writable是Hadoop自己的序列化格式,还要一个子接口是Wr ...

  6. 【转】【Python学习】之哪些 Python 库让你相见恨晚?

    感谢作者:赖明星 文章链接地址:<哪些 Python 库让你相见恨晚?>

  7. python 面试题 删除字符串a中包含的字符串b

  8. 多媒体开发之---开源库ffmeg的log之子解析

    用了ffmeg快两年了,对其中的log甚是感兴趣,今天在做8148项目是,解读h264结构,看了<毕-新一代视频压缩编码标准h246> ,在第六章中的重排序里面看到了好熟悉的4x4矩阵zi ...

  9. SpringMVC基于代码的配置方式(零配置,无web.xml)

    基于配置文件的web项目维护起来可能会更方便,可是有时候我们会有一些特殊的需求,比方防止客户胡乱更改配置,这时候我们须要给配置隐藏到代码中. 1.创建一个动态web项目(无需web.xml) 2.右键 ...

  10. js父页面和子页面之间传值

    今天和朋友一块讨论,怎样通过js在父页面和子页面之间传值的问题,总结例如以下: 需求描写叙述:父页面有多个子页面.实如今父页面点击子页面,传值到子页面. 看着非常easy,试了好久.主要纠结在怎样获取 ...