React-Native初学-项目启动

379 阅读1分钟

一、根据官方文档,进行环境的搭建。

www.reactnative.cn/docs/enviro…

这里需要安装Android Studio,按照部署安装,并下载所需插件即可。

二、项目初始化、运行

由于版本的问题,需要注意

1.删除react-native-cli,重新安装

npm uninstall -g react-native-cli @react-native-community/cli

2.全局安装

npm install -g react-native-cli

3.安装0.69版本以下的react-native,否则在初始化的时候会报错,cli.init is not a function

npm install -g react-native@0.68.2

4.项目初始化

react-native init myFirstApp

5.运行项目

cd myFirstApp yarn android

PS:在运行项目的时候,可能会产生报错,我这边遇到的报错是模拟器相关,解决方案如下:

1)查看emulator的安装目录,并进入该目录

where emulator cd xxxxxx

2)查看avd列表

emulator -list-avdsemulator -list-avds

输出

Pixel_5_API_29

Pixel_5_API_30

Pixel_5_API_31

Pixel_XL_API_25

查看android项目的build.gradle中的 targetSdkVersion = 31 所以,我选择Pixel_5_API_31 这个虚拟机。

3)启动AVD

emulator -avd Pixel_5_API_31

此时,你可以看到一个android虚拟机的窗口

踩坑实记:一开始选择了一个28的,报错,JAVA9只支持30以上的,所以需要选择30以上的。

4)去到项目目录,执行

yarn android

需要稍等片刻,启动成功。