在Mac上搭建React Native开发环境
概述
前面我们介绍过在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)"
然后一路回车
最后出现success,就表示安装成功了。
安装完成后,可以用brew doctor命令检测下是否有什么冲突的地方。关于Homebrew其他的介绍可以自行查看官网资料。
安装 Node.js
React Native 需要 NodeJS 4.0或更高版本,Homebrew的Node默认包是6.0版本的,所以直接安装即可:
brew install node
安装React Native 命令行工具npm
之前我们说过npm是一个包管理工具,它是用来管理node的,详细介绍请看npm详解
命令行工具可以轻松创建和初始化工程:
npm install -g react-native-cli
注:如果出现错误 :EACCES: permission denied,使用命令: sudo npm install -g 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、在MAC上搭建React Native开发环境
@import url(http://i.cnblogs.com/Load.ashx?type=style&file=SyntaxHighlighter.css);@import url(/c ...
- [转] 在Mac上搭建React Native开发环境
原文链接: http://blog.csdn.net/xiangzhihong8/article/details/53914336 概述 前面我们介绍过在window环境下开发React Native ...
- Mac下搭建react native开发环境
安装必需软件 Homebrew Homebrew, Mac系统的包管理器,用于安装NodeJS和一些其他必需的工具软件. /usr/bin/ruby -e "$(curl -fsSL htt ...
- 搭建React Native开发环境
搭建React Native开发环境 本文档是Mac下搭建的环境,针对的目标平台不同,以及开发 iOS 和 Android 的不同,环境搭建也有差异. Github地址:https://github. ...
- React Native开发 - 搭建React Native开发环境
移动开发以前一般都是原生的语言来开发,Android开发是用Java语言,IOS的开发是Object-C或者Swift.那么对于开发一个App,至少需要两套代码.两个团队.对于公司来说,成本还是有的. ...
- 在MAC上搭建python数据分析开发环境
最近工作转型到数据开发领域,想在本地搭建一个数据开发环境.自己有三年python开发经验,马上想到使用numpy.scipy.sklearn.pandas搭建一套数据开发环境. ubuntu的环境,百 ...
- 【RN - 基础】之Windows下搭建React Native开发环境
前言 React Native由Facebook公司于2015年F8大会上开源,其主张“Learn once, write everywhere”.React Native的核心设计理念是:既拥有Na ...
- react-native —— 在Mac上搭建React Native Android开发环境
需要:JDK,Android SDK,Node.js 1.安装JDK 去Java官网下载列表选择Mac OS X x64版 2.安装Android SDK 虽然现在谷歌推荐使用Android ...
- 搭建基本的React Native开发环境
步骤如下: 1.安装HomeBrew,命令如下: 在终端输入命令:$ ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Home ...
随机推荐
- [LeetCode] Brick Wall 砖头墙壁
There is a brick wall in front of you. The wall is rectangular and has several rows of bricks. The b ...
- django 表单过滤与查询
7.1 表的查询 查询 Person.objects.all() Person.objects.all()[:10] 切片操作,获取10个人,不支持负索引,切片可以节约内存 Person.object ...
- scrapy爬取数据进行数据库存储和本地存储
今天记录下scrapy将数据存储到本地和数据库中,不是不会写,因为小编每次都写觉得都一样,所以记录下,以后直接用就可以了-^o^- 1.本地存储 设置pipel ines.py class Ak17P ...
- [BZOJ 3329]Xorequ
Description 题库链接 给出 \(n\) ,分别求 \(\leq n\) 和 \(\leq 2^n\) 的满足方程 \[x\oplus 3x=2x\] 的正整数解个数. \(1\leq n\ ...
- hihoCoder 1596 : Beautiful Sequence
Description Consider a positive integer sequence a[1], ..., a[n] (n ≥ 3). If for every 2 ≤ i ≤ n-1, ...
- 【BZOJ3110】【ZJOI2013】k大数查询
原题传送门 题意简析 给定一个区间,可以在这个区间上每个整数点插入若干个数(这些数数值可以重复)你需要支持2种操作: 1)在[a,b]间所有整数点插入c 2)查询[a,b]内第c大的数 解题思路 树套 ...
- 【USACO】AC自动机
Description 对,这就是裸的AC自动机. 要求:在规定时间内统计出模版字符串在文本中出现的次数. Input 第一行:模版字符串的个数N. 第2->N+1行:N个字符串.(每个模版字符 ...
- ●BZOJ 3123 [Sdoi2013]森林
题链: http://www.lydsy.com/JudgeOnline/problem.php?id=3123 题解: 主席树,在线,启发式合并 简单版(只有询问操作):[2588: Spoj 10 ...
- bzoj1293[SCOI2009]生日礼物 尺取法
1293: [SCOI2009]生日礼物 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 2838 Solved: 1547[Submit][Stat ...
- Android编写点击TextView拨打电话
在任何一个电商平台都会有点击了手机号码会拨打出一个电话 那么高如何实现这个功能,我们下来分析下原理 当我们点击了一个电话号码后,会弹出一个Dialog显示是否拨打次电话号码,点击确定拨打号码,点击取消 ...