好久没有写东西,最近想学一下React Native,借此写一写笔记
React Native 的安装
使用React Native开发iOS应用需要OSX系统,Xcode,Homebrew,node,npm以及watchman和react-native-cli。
1.Mac安装Xcode 略过
2.Mac安装Homebrew。
Homebrew是以最简单,最灵活的方式来安装苹果公司在MacOS中不包含的UNIX工具。
2.1打开终端输入 /usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"
2.2 会有 点击return键和输入密码 如图
3. Mac安装node和npm
已经安装好了Homebrew,可直接安装node和 npm。打开终端:
输入命令行 brew install node 如图:
4.Mac安装watchman 命令行输入 brew install watchman
5.Mac安装flow 命令行输入 brew install flow
6.Mac 安装react-native-cli(用来开发React Native的命令行工具)
命令行输入 npm install -g react-native-cli
Mac电脑JDK和android-SDK 的安装
1.JDK安装
1.1在https://www.oracle.com/index.html网址可直接下载
1.2如图
等待下载完安装即可。
1.3 首次安装,需要做一些配置。
1.3.1 找到home文件路径
1.3.2 打开终端,创建文件 touch .bash_profile
编辑 vim .bash_profile
将 以下 代码粘进去,如图
export JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_40.jdk/Contents/Home
PATH=$JAVA_HOME/bin:$PATH:. CLASSPATH=$JAVA_HOME/lib/tools.jar:$JAVA_HOME/lib/dt.jar:. export JAVA_HOME export PATH export CLASSPATH1.3.3,验证是否成功 直接输入 java
2.通过androidstudio 安装 android-SDK
2.1.安装完androidstudio后,单击androidstudio,右上角选择Preferences.
2.2.androidstudio安装的最新的SDK,开发兼容旧的安卓系统,还是需要安装不同版本的 sdk
2.3.等待安装完
2.4.安装android模拟器
打开Androidstudio,创建一个新工程,开始安装模拟器
等模拟器完成,进行测试是否安装成功。
如此便安装成功。
创建项目初始化
1.命令行创建一个NativeTest的项目( react-native init NativeTest )
先运行iOS,直接用Xcode打开,
运行之后,就会发现报错,找不到#import <React/RCTBundleURLProvider.h> 文件,这是因为 init 命令默认会创建最新的版本,而目前最新的 0.45 及以上版本需要下载 boost 等几个第三方库编译。这些库在国内即便翻墙也很难下载成功,导致无法运行iOS项目。可以使用--version
参数(注意是2个杠)创建指定版本的项目。例如react-native init MyReactiveApp --version 0.55.3
。注意版本号必须精确到两个小数点。
再试一次,react-native init MyReactiveApp --version 0.55.3,打开iOS项目运行
这次就成功了
再试试android运行一下,如图
完成
注:在运行ios时遇到这个问题
原因:找了很久,才发现是在运行时打开了翻墙软件,只要关闭就可以,吐血三升啊