年少无知,跳坑Rn,电脑已砸,人已痴狂
React Native (简称RN)是Facebook于2015年开发的移动端框架,目前支持iOS和安卓两大平台。RN使用Javascript语言,类似于HTML的JSX,以及CSS来开发移动应用,让前端开发人员只需很少的学习就可以进入移动应用开发领域。
文章底部有配置的官方文档和教学视频
一、环境需求
1.1、安装HomeBrew
Homebrew, 是Mac 系统的包管理器,用于安装 NodeJS 和一些其他必需的工具软件。用命令安装软件包,一条命令即可搞定,例如
brew install node
Homebrew的安装和卸载
在终端输入如下命令:
/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
安装过程中需要按回车和输入密码
如果要卸载也很简单
/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/uninstall)"
安装成功后,会自动创建/usr/local/Cellar目录来存放安装的程序,这时我们就可以使用brew命令了。
等待安装成功后验证一下brew的版本,在终端输入命令:
brew -v
Homebrew 2.0.4
Homebrew/homebrew-core (git revision e3b6; last commit 2019-03-14)
Homebrew的常用命令
查找命令:brew -h
搜索软件:brew search
安装软件:brew install
卸载软件:brew uninstall
更新所有软件:brew update
更新具体软件:brew upgrade
显示安装软件:brew list
查看软件信息:brew info / home(home是打开软件的官网)
查看哪些软件需要更新:brew outdated
例如:但我们需要卸载node时,终端输入 brew uninstall node
1.2、安装Node 和 Watchman
node.js启动本地server开发环境,实时预览,编译,打包都是基于node.js的相应的npm包完成的,react native的开发环境中也涉及到这些,自然,node.js是必须安装的基础环境。
Watchman则是由 Facebook 提供的监视文件系统变更的工具。安装此工具可以提高开发时的性能。我们推荐使用Homebrew来安装 Node 和 Watchman。
在终端输入命令:brew install node
静看代码翻滚
在终端输入命令:brew install watchman
静看代码翻滚
验证Nodejs是否安装成功,在终端输入命令:node -v
JerryMacBook-Pro:~ Jerry.Yao$ node -v
v8.9.1
验证watchman是否安装成功,在终端输入命令:watchman -v
JerryMacBook-Pro:~ Jerry.Yao$ watchman -v
4.9.0
1.3 安装react-native-cli命令行工具
之前安装好的Node.js 就内置了 npm,npm是什么?Node Package Manager(node包管理器)。我们用npm来安装react-native-cli。在终端中运行以下命令:
sudo npm install -g react-native-cli
命令行里的sudo
用来提升运行命令的权限
命令行里的-g
是安装到全局
1.4 安装react-native框架包
React Native分发为两个npm包,react-native-cli和react-native。第一个是轻量级包,应该全局安装 npm install -g react-native-cli
第二个包含实际的React Native框架代码,并在运行时本地安装到项目中react-native init。我们用GIt下载地址react-native。在终端中运行以下命令:
git clone https://github.com/facebook/react-native.git
1.5 React Native 安装配置的视频链接地址
B站上 React Native 环境配置教学视频
1.可以先看几分钟视频,在根据视频内容,复制粘贴官方文档到终端命令行
在Mac系统上完成RN开发环境的搭建
2.知乎上的参考文档内含安装,Xcode和Android Studio模拟器的方法:
END
1.6 使用npm安装yarn
npm install yarn -g
测试查看版本:
yarn --version