主要参考 https://reactnative.cn/docs/getting-started.html react-native中文网

IOS版

1、Node v10以上、Watchman 和 React Native 命令行工具以及 Xcode

先安装brew工具,这样便于后面安装,第一次安装可能比较慢,耐心等待。。。

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

安装完之后,由于默认使用了国外镜像源,速度较慢,得修改源地址为国内的。
)替换brew.git
cd "$(brew --repo)"
git remote set-url origin https://mirrors.ustc.edu.cn/brew.git )替换homebrew-core.git
cd "$(brew --repo)/Library/Taps/homebrew/homebrew-core"
git remote set-url origin https://mirrors.ustc.edu.cn/homebrew-core.git

安装node

brew install node  这里可能会提示要你按照依赖包,按照所给出的提示安装即可

安装watchman

brew  install watchman
同样也修改镜像地址

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

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

2、 React Native 的命令行工具(react-native-cli),Yarn是 Facebook 提供的替代 npm 的工具,安装完 yarn 之后就可以用 yarn 代替 npm 了,例如用yarn代替npm install命令,用yarn add 某第三方库名代替npm install 某第三方库名

npm install -g yarn react-native-cli
修改镜像地址
yarn config set registry https://registry.npm.taobao.org--global  yarn config set disturl https://npm.taobao.org/dist --global 

3、React Native 目前需要Xcode 9.4 或更高版本,APP Store下载即可

4、初始化项目

react-native init AwesomeProject

5、编译并运行 React Native 应用

cd AwesomeProject

react-native run-ios
注意: 此步骤可能会提示xcrun: error: unable to find utility "instruments", not a developer tool or in PATH错误,

解决方法:

、sudo xcode-select -s /Applications/Xcode.app/Contents/Developer/ 命令即可解决此问题

可能会提示Could not find iPhone  simulator--

解决方法:

、react-native run-ios --simulator="iPhone 6",运行时指定启动版本

 、打开项目文件node_modules/react-native/local-cli/runIOS/findMatchingSimulator.js

然后,Check if your device version is correct, e.g: in line  console.log(version) 。在文件30行,对比是否是这个条件:Compare it with condition in line : if (version.indexOf('iOS') !== ) {

  注释掉的是version.indexOf('iOS') !== ,然后替换成

if (version.indexOf('iOS') !==  && !version.includes('iOS')) {
continue;
}

6、 再重新执行react-native run-ios --simulator="iPhone 6" 命令,如果成功就可以看到手机模拟运行的效果了

android版

1、下载adroid studio https://developer.android.google.cn/studio/

2、按照https://reactnative.cn/docs/getting-started.html上面给出的安装步骤依次操作即可,上面说是要翻墙,但好像不翻也可以!!!

需要注意的地方是在运行项目的时候,得先新建模拟器,不然在react-native run-android执行时,

会出现installDebug FAILED,网上说修改gradle版本,还有改distributionURL参数。本人都没改,在Android studio 新建好模拟器即可!!!

至此,以上就是本人在Mac 10.14.6 搭建react-native的过程及其过程中所遇到的问题,给小伙伴们提供个参考吧。

mac+react-native环境搭建的更多相关文章

  1. Ubuntu17.10 React Native 环境搭建

    React Native 环境搭建 环境:ubuntu17.10 安装依赖 必须安装的依赖有:Node.React Native 命令行工具以及 JDK 和 Andriod Studio. 安装nod ...

  2. React Native环境搭建以及几个基础控件的使用

    之前写了几篇博客,但是没有从最基础的开始写,现在想了想感觉不太合适,所以现在把基础的一些东西给补上,也算是我从零开始学习RN的经验吧! 一.环境搭建 首先声明一下,本人现在用的编辑器是SublimeT ...

  3. 初学 React native | 环境搭建(在模拟器上运行)

    我的电脑是windows 所以就以 windows上+Android 配置React native 环境 网上的安装教程非常多,我总结了一下,配置环境时出错原因主要是node java python ...

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

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

  5. React Native环境搭建(iOS、Mac)

    http://reactnative.cn/docs/0.42/getting-started.html#content 1.安装Homebrew Homebrew, Mac系统的包管理器,用于安装N ...

  6. react Native环境 搭建

    react Native的优点:跨平台 低投入高回报 性能高 支持动态更新.一才两用(ios和Android) 开发成本第 代码复用率高.windows环境搭建react Native开发环境1.安装 ...

  7. 逻辑性最强的React Native环境搭建与调试

    React Native(以下简称RN),已经“火”了好一段时间了,网上的资料相对也很丰富,只是一直迟迟没有发布1.0,不过出身豪门(Facebook)的RN和国内顶级互联网公司对于RN的实践与应用, ...

  8. React Native 环境搭建踩坑

    React Native (web Android)环境搭建踩坑(真的是一个艰辛的过程,大概所有坑都被我踩了 官方文档地址 : https://facebook.github.io/react-nat ...

  9. React-Native(一):React Native环境搭建

    第一步:安装jdk 从java官网下载jdk8 配置环境变量: JAVA_HOME:D:\Program Files\Java\jdk1.8.0_111 Path中追加:%JAVA_HOME%\bin ...

  10. react native环境搭建(含错误处理)

    1.  Python 2  注意,不要选择3.0及以上的,还不成熟 安装过程中一直 next就可以了,但是注意下图,勾选添加到系统环境变量 安装完之后cmd输入 python 查看是否安装成功. 补充 ...

随机推荐

  1. jmeter之报告输出(html)

    在使用jmeter进行测试时,我们需要生成相应的测试报告,jmeter3.0之后有自带的测试报告. 在测试报告的格式和输出内容不满足需求时,我们可以根据需要去修改其配置文件(jmeter.proper ...

  2. mysql explain中的列

    参考:<高性能mysql>附录D EXPLAIN MySql将Select查询分为简单和复杂类型,复杂类型分为3大类:简单子查询,所谓的派生表(在派生表的子查询),以及UNION查询. 列 ...

  3. java 上传文件到FTP(centos中的ftp服务)

    ftp服务器系统:centos7 提供ftp的服务:vsftpd pom.xml 依赖 <dependency> <groupId>commons-net</groupI ...

  4. spss中如何处理极端值、错误值

    spss中如何处理极端值.错误值 spss中录入数据以后,第一步不是去分析数据,而是要检验数据是不是有录入错误的,是不是有不合常理的数据,今天我们要做一个描述性统计,进而查看哪些数据是不合理的.下面是 ...

  5. Hibernate一级缓冲

    Hibernate的一级缓冲 什么是缓冲 缓冲概念: 数据存在数据库中,数据库本身就是一个文件系统,使用流的方式操作文件,但是文件中有很多的内容,用流的操作得效率就低. 解决办法: 把数据存在内存中, ...

  6. ES6标准入门 第三章:变量的解构赋值

    解构赋值:从数组和对象中提取值,对变量进行赋值. 本质上,这种写法属于“匹配模式”:只要等号两边的模式相同,左边的变量就会被赋予对应的值. 1.数组的结解构赋值 基本用法 let [foo, [[ba ...

  7. RabbitMQ使用(上)

    1. 说明 在企业应用系统领域,会面对不同系统之间的通信.集成与整合,尤其当面临异构系统时,这种分布式的调用与通信变得越发重要.其次,系统中一般会有很多对实时性要求不高的但是执行起来比较较耗时的地方, ...

  8. Command line is too long. Shorten command line for testMLDome1 or also for Application default configuration

    在.idea文件夹中,更改workspace.xml文件 加这段语句: <property name="dynamic.classpath" value="true ...

  9. [Python3] 042 日志

    目录 LOG 1. 日志相关概念 1.1 日志的级别 level 1.2 LOG 的作用 1.3 日志信息 1.4 成熟的第三方日志 1.5 注意 2. Logging 模块 2.1 日志级别 2.2 ...

  10. 【监控笔记】【2.4】SQL Server中的 Ring Buffer 诊断各种系统资源压力情况

    SQL Server 操作系统(SQLOS)负责管理特定于SQL Server的操作系统资源. 其中相关的动态管理试图sys.dm_os_ring_buffers将被标识为仅供参考.不提供支持.不保证 ...