devStandard/docs/learning/7-react/10-react native.md
2025-03-29 14:35:49 +08:00

1.4 KiB

react native

Create native apps for Android, iOS, and more using React

环境搭建

https://reactnative.cn/docs/environment-setup

基础环境

node lts版本 # 可以使用fnm来管理多个版本
npm install -g yarn

安卓

# Java Development Kit [JDK] 11
brew tap homebrew/cask-versions
brew install --cask zulu11
javac -version 

Android Studio 安装与设置

Intel x86 Atom_64 System Image 可以不安装, 使用第三方模拟器或者实体机

安卓模拟器

模拟器可以安装mumu模拟器

# 验证mumu是否启动, macos mumu端口是22471
sudo lsof -i:22471
adb connect 127.0.0.1:22471 # 提示failed to connect 不用管
adb kill-server
adb start-server
adb devices
# 验证
adb shell pm list packages 

ios

brew install watchman 

xcode: 最新版到appstore下载, 旧版到https://developer.apple.com/download/all/?q=xcode下载

创建项目

npx react-native@latest init AwesomeProject
cd AwesomeProject
yarn android

Metro 界面, 按下按键 a, 安装到模拟器

debug

按键 d , 显示菜单, 选择debug模式

# 或者通过adb发送按键
adb shell input keyevent 82

闪退原因:未知

# 使用更强大的react-native-debugger代替chrome
brew install --cask react-native-debugger