React-Native的环境搭建

趁着这个清明假期,可以好好的做一下总结,最近又在做RN的项目,刚开始也是一筹莫展的,最终也是完成了环境搭建,好了废话不多说了,直接进入主题吧.

 RN官网的连接:搭建开发环境 · React Native 中文网

JAVA_SDK:Java Downloads | Oracle

Python_SDK:Welcome to Python.org

Download Android Studio and SDK tools  |  Android Developers (google.cn)Android Studio:Download Android Studio and SDK tools  |  Android Developers (google.cn)

第一步:配置项目需要下载JAVA的SDK,Python的SDK ,有的下载包是.tar的文件,这个就需要进行解压,在进行安装,可以使用360压缩进行解压

第二步:需要下载Android Studio,下载完成之后呢,需要根据官网上的只是进行下一步的androidSDK的安装,直接放图进行吧(官网上的有些是一些老版本的界面,建议直接在安装界面只安装就可以了,具体的到界面里面进项下载就好)

1.进入SDK Manager

 2.这是点击SDK  Manager的界面,进行指示操作

3.同一个页面,点击中间的tab,切换SDK tools进行选中

 4.最后选种完,点击apply下载,等待就好了

第三步:我们这里使用的是Android Studio自带的模拟器,模拟器自身比较的方便,不需要来回的看手机,接下来我们进行模拟器的配置操作

点击模拟器的图标进行创建

 2.创建模拟器的界面,按照系统默认的选项就行

 

 给自己的模拟器取个名字(会在配置的时候有用),点击 结束就可以了

 第四步:配置好androidSDK的环境变量还有Java_home 的环境变量(可以详细看官网的介绍)

直接搜索就可以了

 

 说明一下,androidSDK的路径在android studio里面AnroidSDK里面是有的(可以详细看看以上的截图)

AndroidSDK :  C:\Users\HP\AppData\Local\Android\Sdk

Path  :  %LOCALAPPDATA%\Android\Sdk\platform-tools

Java_home   :C:\Program Files\Java\jdk1.8.0_171

 然后进入到AndroidSDK :  C:\Users\HP\AppData\Local\Android\Sdk的路径下面

找到emulator的文件

 创建一个runEmulator.bat的批处理文件  然后右键编辑  

修改完之后进行保存,然后关闭这个文件,但是不要关闭整个androidSdk的文件夹,待会还要打开

 把你的项目代码拉到android Studio里面进行拉取代码的操作,保证是最新的代码,然后关闭android studio的模拟器,也关闭android studio

打开Vscode  打开你RN的项目,进行npm install,

然后回到刚才 C:\Users\HP\AppData\Local\Android\Sdk\emulator 路径里面双击runEmulator,就会看到你创建的模拟器已经启动了

 这是一个独立的模拟器  然后在你RN项目下CMD  进行npx react-native run-android的命令操作就可以了

 此时看,就已经连接成功了,就可以开发了

 

结束喽,疫情当下,也是觉得很不容易,写的不好的地方欢迎指正啦,祝疫情早点过去,祝大家身体健康啦.