mac+react-native环境搭建
主要参考 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环境搭建的更多相关文章
- Ubuntu17.10 React Native 环境搭建
React Native 环境搭建 环境:ubuntu17.10 安装依赖 必须安装的依赖有:Node.React Native 命令行工具以及 JDK 和 Andriod Studio. 安装nod ...
- React Native环境搭建以及几个基础控件的使用
之前写了几篇博客,但是没有从最基础的开始写,现在想了想感觉不太合适,所以现在把基础的一些东西给补上,也算是我从零开始学习RN的经验吧! 一.环境搭建 首先声明一下,本人现在用的编辑器是SublimeT ...
- 初学 React native | 环境搭建(在模拟器上运行)
我的电脑是windows 所以就以 windows上+Android 配置React native 环境 网上的安装教程非常多,我总结了一下,配置环境时出错原因主要是node java python ...
- Mac系统下React Native环境搭建
这里记录一下在Mac系统下搭建React Native开发环境的过程: 1. 安装HomeBrew: /usr/bin/ruby -e "$(curl -fsSL https://raw.g ...
- React Native环境搭建(iOS、Mac)
http://reactnative.cn/docs/0.42/getting-started.html#content 1.安装Homebrew Homebrew, Mac系统的包管理器,用于安装N ...
- react Native环境 搭建
react Native的优点:跨平台 低投入高回报 性能高 支持动态更新.一才两用(ios和Android) 开发成本第 代码复用率高.windows环境搭建react Native开发环境1.安装 ...
- 逻辑性最强的React Native环境搭建与调试
React Native(以下简称RN),已经“火”了好一段时间了,网上的资料相对也很丰富,只是一直迟迟没有发布1.0,不过出身豪门(Facebook)的RN和国内顶级互联网公司对于RN的实践与应用, ...
- React Native 环境搭建踩坑
React Native (web Android)环境搭建踩坑(真的是一个艰辛的过程,大概所有坑都被我踩了 官方文档地址 : https://facebook.github.io/react-nat ...
- React-Native(一):React Native环境搭建
第一步:安装jdk 从java官网下载jdk8 配置环境变量: JAVA_HOME:D:\Program Files\Java\jdk1.8.0_111 Path中追加:%JAVA_HOME%\bin ...
- react native环境搭建(含错误处理)
1. Python 2 注意,不要选择3.0及以上的,还不成熟 安装过程中一直 next就可以了,但是注意下图,勾选添加到系统环境变量 安装完之后cmd输入 python 查看是否安装成功. 补充 ...
随机推荐
- 3,、maven修改jar包下载为国内镜像下载地址
maven 默认的中央仓库是在国外的服务器,下载速度慢,有时候稍不注意就下载出错 通常我将maven的中央仓库修改为阿里云的地址,下载速度很快体验非常好 修改conf下的setting.xml文件 在 ...
- iOS应用将强制使用HTTPS安全加密-afn配置https(190926更新)
WWDC 2016苹果开发者大会上,苹果在讲解全新的iOS10中提到了数据安全这一方面,并且苹果宣布iOS应用将从2017年1月起启用名为App Transport Security的安全传输功能. ...
- 阶段3 1.Mybatis_11.Mybatis的缓存_2 延迟加载和立即加载的概念
用户关联的account信息,假设一个用户管理的account有100个.那么我们在查询用户的时候那100个关联的信息也被查询出来. 用的时候才去查关联的数据 这两个不同的地方就是查询的时机不同 什么 ...
- 阶段3 1.Mybatis_03.自定义Mybatis框架_3.自定义mybatis的编码-根据测试类中缺少的创建接口和类
先认识一下这几个类.Resources是一个class SqlSessionFactoryBuilder 创建新项目 复制相关的依赖 复制之前的代码 复制到当前项目的src下 把Mybits的依赖删除 ...
- application.events 识别组合键 参考。
https://blog.csdn.net/chinayu2007/article/details/43761277 在窗体上放上ApplicationEvents控件,在OnMessage消息中加入 ...
- oracle expdp/impdp/可传输表空间
oracle expdp/impdp/可传输表空间/及一些参数 Oracle data pump 导出操作能够将表.索引.约束.权限.PLSQL包.同义词等对象从数据库导出,并将它们保存在一种非文本格 ...
- laravel 多字段登录
protected function validateChinaPhoneNumber($number) { return preg_match('/^1[34578]\d{9}$/', $numbe ...
- CF 686D. Kay and Snowflake
给你一个树N个点,再给出Q个询问,问以x为根的子树中,重心是哪个?2≤n≤300000,1≤q≤30000 Sol:从下到上,根据性质做一下.1:如果某个点x,其子树y的大小超过总结点个数一半,则重心 ...
- Redis进阶:Redis的哨兵模式搭建
Redis进阶:Redis的哨兵模式搭建 哨兵机制介绍 单机版的Redis存在性能瓶颈,Redis通过提高主从复制实现读写分离,提高了了Redis的可用性,另一方便也能实现数据在多个Redis直接的备 ...
- Linux常用命令基础
linux 常用指令 基础命令 宿主目录 目录结构 文件管理 目录管理 用户管理 别名管理 压缩包管理 网络设置 shell技巧 帮助方法 /表示根目录 ~表示家目录 软件的安装(光盘中的软件呢): ...