mac android react native 环境搭建

本文详细介绍如何搭建React Native开发环境,包括配置JDK、Android Studio、Node.js及npm等工具,通过具体步骤引导读者完成环境变量设置,并利用React Native CLI创建、运行首个应用程序。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1,jdk

2,android studio 集成开发环境

3,配置adb环境变量

 cd用户主目录  cd ~

然后如果目录下不存在.bash_profile文件,则创建该文件

$touch .bash_profile

打开该文件夹

$open .bash_profile

 

JAVA_HOME=/Library/Java/JavaVirtualMachines/jdk1.8.0_92.jdk/Contents/Home

export PATH=$JAVA_HOME/bin:$PATH

ANDROID_HOME=Library/Android/sdk

 

export PATH=$ANDROID_HOME/tools:$ANDROID_HOME/platform-tools:$PATH

 

保存并退出,然后执行

$source .bash_profile

测试

$adb version

4,安装nodejs,https://nodejs.org/en/  安装包自动安装nodejs和npm

  检测 node --version  npm --version查看版本号

 

5,安装react native

sudo npm install -g react-native-cli

-g意思是全局安装

$open /usr/local/lib/node_modules   可以看到npm在全局安装的所有包

6,初始化示例项目

$react-native init AwesomeProject  需等待一段时间

 

7,启动react-native服务,运行测试项目

cd AwesomeProject

$react-native run-android

第一次运行可能会安装gradle,速度有点慢,要耐心,等等等。。。 PS:测试推荐使用真机,安卓虚拟机启动速度不想吐槽。。。 真机调试时,如果一打开一片红,“Unable to download JS bundle”,请摇晃手机,在弹出的选单里选择Dev Settings,选Debug server host for device,然后输入电脑的IP地址,此时手机要与电脑(编译环境)在同一Wifi环境下 

8,编辑代码

 打开index.android.js并修改部分代码,保存 摇动手机,点Reload JS,可以看到界面变化了(增加静态资源时,需要重新编译)

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值