入门准备
创建react native app有两种方式,一种是快速开始方式,无需安装android studio或xcode,借助官方的工具App Expo客户端可以快速查看效果,另一种是带有原生代码,需要安装android或xcode,可以扩展原生插件,可以打包出app,下面简单说下两种方式的安装步骤。
快速开始
你要安装有node,如果没有的话,请到node官网下载安装。安装好node之后,使用npm安装create-react-native-app
,打开一个命令行终端,输入下面命令:
npm install -g create-react-native-app
如果速度太慢,可以设置一下npm国内镜像或者科学上网,通过下面命令设置npm镜像
npm config set registry https://registry.npm.taobao.org --global
npm config set disturl https://npm.taobao.org/dist --global
顺带说一下,这里或后续的各种安装不怎么建议使用cnpm,可能会因为安装的模块路径与npm的不太一样产生一些其他的问题。安装好create-react-native-app
,输入下面命令创建工程并开启服务
create-react-native-app AwesomeProject
cd AwesomeProject
npm start
开启服务之后,最终你可以在命令行终端中看到如下图的输出
命令行输出 ,控制台输出了一个二维码和ip地址,接下来打开Expo App,这个App可以在google play和ios的app stroe下载。不能科学上网的android同学,这边放一个Expo 2.0.0网盘链接。使用Expo扫描命令行终端上的二维码,不要扫我的,PC和手机要在一网段内。
创建带原生代码的RN工程
这边只介绍windows系统下android环境的搭建,其他环境搭建的请前往RN官网或国内RN中文网查看。
你需要安装的有Node,React Native CLI,Python2,JDK,Android Studio。
有稳定梯子的话可以使用Chocolatey来安装Node,Python2和Jdk,Chocolatey是一个windows的包管理器。安装好Chocolatey,输入下面命令
choco install -y nodejs.install python2 jdk8
否则的话就到各自的官网上去下载安装上面这些,或者你之前已经安装好了,检查一下Node的版本是否大于等于4,JDK的版本大于等于8。
安装好上面那些之后,通过npm安装React Native CLI
npm install -g react-native-cli
最后就是android开发环境的搭建
前去官网下载安装android studio,上不去的可以到android studio中文社区下载或自行搜索下载。下载完成后打开安装,安装完成后来到下面的欢迎界面
ANDROID_HOME
如下图
环境变量
,注意这边的路径为自己电脑上SDK的放置路径。到这里,算是大功告成了。可以开始新建第一个项目了。
react-native init AwesomeProject
接下来测试安装
cd AwesomeProject
react-native run-android
``
网友评论