Mac系统下React Native环境搭建
这里记录一下在Mac系统下搭建React Native开发环境的过程:
1. 安装HomeBrew:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
安装完后如下所示:
\
可使用命令:”brew -v“查看其版本。
2. 安装Node.JS: brew install node,也可以在node.js官网下载pkg安装包进行安装。

3. 安装React Native的命令行工具:(需要sudo来安装,有些目录需要高级权限)

4. 安装Watchman,它是由Facebook提供的监视文件系统变更的工具。(下面两个工具推荐安装)
brew install watchman
5. 安装Flow,它是一个静态的JS类型检查工具,可方便找出代码中可能存在的类型错误。
brew install flow
6. 接下来就可以创建项目了:

出现这个错误,需要检查一下node版本,需要4.0以上。(之前的node使用了系统原来的--v0.4.1,这里修改PATH环境变量,指向我们安装的。)
再次运行,出现如下错误:

安装nvm:
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash

安装cnpm:
sudo npm install cnpm -g
安装invariant:
npm install invariant -g
再次运行:

新建项目成功,看看目录结构:

在新建项目成功后,react也告诉我们该怎么运行:react-native run-***。
注意,使用小米手机,需要在开发者模式把"MIUI优化"关闭,否则,无法直接安装apk:

现在进入项目根目录执行"react-native run-android",可以看到,rn服务器端首先被启动:

然后从jenter下载必须的依赖包并开始编译:

启动过程中输出:

安装完后,手机截图如下:

类似,也可以执行"react-native run-ios"来打开模拟器运行,或直接打开xcode项目来run。
Mac系统下React Native环境搭建的更多相关文章
- Mac系统下STF的环境搭建和运行
本文参考以下文章整理:MAC 下 STF 的环境搭建和运行 一. 前言 STF,全称是Smartphone Test Farm,WEB 端批量移动设备管理控制工具,就是可以用浏览器来批量控制你的移动设 ...
- Ubuntu17.10 React Native 环境搭建
React Native 环境搭建 环境:ubuntu17.10 安装依赖 必须安装的依赖有:Node.React Native 命令行工具以及 JDK 和 Andriod Studio. 安装nod ...
- 初学 React native | 环境搭建(在模拟器上运行)
我的电脑是windows 所以就以 windows上+Android 配置React native 环境 网上的安装教程非常多,我总结了一下,配置环境时出错原因主要是node java python ...
- Windows系统下Android开发环境搭建
“工具善其事,必先利其器”.要想学好Android,搭建好Android开发环境是一个良好的开端. Windows系统下Android开发环境主要有4个大的步骤.分别是: 1.JDK的安装 2.ecl ...
- 一寸宕机一寸血,十万容器十万兵|Win10/Mac系统下基于Kubernetes(k8s)搭建Gunicorn+Flask高可用Web集群
原文转载自「刘悦的技术博客」https://v3u.cn/a_id_185 2021年,君不言容器技术则已,欲言容器则必称Docker,毫无疑问,它是当今最流行的容器技术之一,但是当我们面对海量的镜像 ...
- React Native环境搭建(iOS、Mac)
http://reactnative.cn/docs/0.42/getting-started.html#content 1.安装Homebrew Homebrew, Mac系统的包管理器,用于安装N ...
- React Native环境搭建以及几个基础控件的使用
之前写了几篇博客,但是没有从最基础的开始写,现在想了想感觉不太合适,所以现在把基础的一些东西给补上,也算是我从零开始学习RN的经验吧! 一.环境搭建 首先声明一下,本人现在用的编辑器是SublimeT ...
- windows 7下React Native环境配置
React Native 是 Facebook 推出的一个用 Java 语言就能同时编写 ios,android,以及后台的一项技术,它可以做到实时热更新 .FaceBook 也号称这们技术是 “Le ...
- 逻辑性最强的React Native环境搭建与调试
React Native(以下简称RN),已经“火”了好一段时间了,网上的资料相对也很丰富,只是一直迟迟没有发布1.0,不过出身豪门(Facebook)的RN和国内顶级互联网公司对于RN的实践与应用, ...
随机推荐
- 使用django开发博客过程记录2——博客首页及博客详情的实现
1.什么是CBV(Class-based views) 2.博客首页及博客详情实现 1.什么是CBV 什么是CBV?说白了就是以前是视图为处理请求返回响应的函数,有了cbv之后我们就可以用类处理请求和 ...
- Openstack学习目录
1.2016.12.27 ceph简介 crush算法 OSD(boject storage device) Mds(cephfs) 使用cephfs时需要安装metadata s ...
- jquery1.7.2的源码分析(一)
说到jquery可能是大家最经常用到的,在日常的编写程序中最经常使用到,在使用jquery插件的同时,深入的解读jquery源码有利于我们学到设计的思想和实现的技巧 在jquery源码的分析中,其中艾 ...
- websocket
websocket是一个协议,在单个TCP连接上提供全双工通信. websocket被设计并被实现在 web浏览器和 web 服务器上,但是它可以被用于任何c/s 架构的应用程序中. websock ...
- Spring Data JPA 学习记录1 -- 单向1:N关联的一些问题
开新坑 开新坑了(笑)....公司项目使用的是Spring Data JPA做持久化框架....学习了一段时间以后发现了一点值得注意的小问题.....与大家分享 主要是针对1:N单向关联产生的一系列问 ...
- 5天揭秘js高级技术-第二天
一.数组 1. 什么是数组? 数组就是一组数据的集合: 其表现形式就是内存中的一段连续的内存地址: 数组名称其实就是连续内存地址的首地址: 2. 关于js中的数组定义 数组定义无需指定数据类型: 数组 ...
- linux查看端口占用情况
今天要使用python写一个端口探测的小程序,以检测一些特定的服务端口有没有被占用,突然发现自己居然不知道在linux中如何查询端口被占用的情况,天呐,赶快学习一下.
- Linux软件包管理
Linux软件包管理 Linux软件包管理主要有2类:是二进制包管理.源码包管理 二进制包管理 主要有RPM和YUM两种 RPM包管理 安装 --ivh:-v ,-vv,-vvv显示的安装信息依次详细 ...
- Node.js学习笔记(一)
1.回调函数 node是一个异步事件驱动的平台,所以在代码中我们经常需要使用回调函数. 例: setTimeout(function(){ console.log('callback is calle ...
- DOM0编程与基础方法
## 这里记录一下DOM编程的基础与方法----### DOM 的O:对象 objectO表示Object,对象的意思.JavaScript中对象可以分为三种类型1. 用户定义对象(user-defi ...