在windows搭建react-native android 开发环境总结

川长思鸟来 2022-03-12 05:42 293阅读 0赞

1.安装必须的软件

**1.Python 2 **

** ** 注意勾选 Add python.exe to Path,选项，这样就可以在安装完成后，不用手动去添加环境变量

![879083-20170207225613947-226305586.png][]

安装完，打开cmd.exe,输入python,然后enter,如果能成功返回ptython的版本号等信息，则说明安装成功。

** **

**2.Node.js**

安装完node之后，打开cmd.exe,输入node -v,如果返回node.jsben，则说明node.js,安装成功。

由于npm在国内的速度奇慢，建议使用淘宝代理，或者使用其他科学上网工具

使用淘宝代理的方法：

**npm config set registry https://registry.npm.taobao.org --global**

**    npm config set disturl https://npm.taobao.org/dist --global**

--------------------

**3.安装react-native命令行工具(react-native-cli)**

**npm install -g yarn react-native-cli**

安装成功之后，打开cmd.exe,输入

**react-native -v**

,然后enter,如果能成功返回react-native的版本号，则说明安装成功。

** **

**4.安装Android Studio**

a.安装jdk

需要jdk1.8以上版本,具体安装教程：[http://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html][http_jingyan.baidu.com_article_6dad5075d1dc40a123e36ea3.html]

安装完成之后，打开cmd.exe,输入

** java -version**

如果成功返回版本信息，则说明安装成功。

b.安装android studio

1.需要android studio 2.0以上版本，确认勾选安装 android SDK和Android Device Emulator

2.安装完成后，选择Custom安装项

![879083-20170207225950776-1249227445.png][]

3.下一步一定要勾选HAXM加速驱动和模拟器

![879083-20170207230046854-779542406.png][]

4.安装完成之后没在Android Studio的欢迎界面选择 Configure | SDK Manager

![879083-20170207230138494-191844240.png][]

*  在`SDK Platforms`窗口中，选择`Show Package Details`，然后在`Android 6.0 (Marshmallow)`中勾选`Google APIs`、`Android SDK Platform 23`、`Intel x86 Atom System Image`、`Intel x86 Atom_64 System Image`以及`Google APIs Intel x86 Atom_64 System Image`。

![879083-20170207230219651-607887476.png][]

*  在`SDK Tools`窗口中，选择`Show Package Details`，然后在`Android SDK Build Tools`中勾选`Android SDK Build-Tools 23.0.1`。（必须是这个版本）

![879083-20170207230303307-1701238914.png][]

然后点击apply和ok,等待安装完成。

5.ANDROID\_HOME 环境变量配置

新建系统环境变量，填写android  sdk的安装目录

![879083-20170207230447135-851688066.png][]

6.将android SDK的Tools目录添加到系统环境变量中去

需要添加android SDK目录下的tools和platform-tools两个路径

![879083-20170207230514447-1550112175.png][]

**5.安装Genymotion**

1.下载和安装Genymotion(需要先注册才能看到download的选项，genymotion需要依赖VirtualBox虚拟机，下载选项中提供了包含虚拟机和不包含的选项，请按需下载)。

2.打开Genmotion,点击ADD,新增一个android的设备，请务必选择5.0以上版本的android系统，不然出现各种奇怪的问题。

3.选中新增加的设备，点击Start按钮，等待片刻即可打开android虚拟机

4.打开cmd.exe,输入

** adb devices**

如果返回类似下图所示，则表明虚拟机启动成功。

![879083-20170207230540447-243311804.png][]

**6.初始化react-native 项目**

硬盘上新建文件夹，然后打开cmd.exe,切换到该目录，然后执行

**react-native init myProject**

这个过程可能会耗费一段时间，请耐心等待，初始化完成之后，切换到新建的myProject文件夹，执行

**react-native run-android**

等待编译完成，直到在android的虚拟机上出现 WelCome to react-native,则大功告成，修改index.android.js,保存之后，在鼠标移动到虚拟机上，然后点击两次键盘R,就会触发新代码更新到虚拟机。

![879083-20170207230610244-2092824246.png][]

2.问题总结

1.很多安装过程耗费时间，等耐心等待，没有安装完不要关掉，不要着急

2.建议第一次启动项目的时候，使用5.0以上版本的android虚拟机，不要使用国产的android机，能被坑死的节奏！

3.如果国产手机安装不上，可以使用adb install android/app/build/outputs/apk/app-debug.apk命令来安装

转载：[https://www.cnblogs.com/sylvenas/p/6376300.html][https_www.cnblogs.com_sylvenas_p_6376300.html]

[879083-20170207225613947-226305586.png]: /images/20220312/8b1d96e44ad74f45bf43a8e4d9cb19ba.png
[http_jingyan.baidu.com_article_6dad5075d1dc40a123e36ea3.html]: http://jingyan.baidu.com/article/6dad5075d1dc40a123e36ea3.html
[879083-20170207225950776-1249227445.png]: /images/20220312/a781770548ac41f39e109bcfbe274f47.png
[879083-20170207230046854-779542406.png]: /images/20220312/118308a801f445099ac26503018d85d3.png
[879083-20170207230138494-191844240.png]: /images/20220312/5f25154fb8d24315859d0cf52fc8a654.png
[879083-20170207230219651-607887476.png]: /images/20220312/fffd55b04eff4466b3a7a4f4025e9846.png
[879083-20170207230303307-1701238914.png]: /images/20220312/d715fad749d94d049831267a5838ba24.png
[879083-20170207230447135-851688066.png]: /images/20220312/1dd36ea034df4bb3aa892c93754773f0.png
[879083-20170207230514447-1550112175.png]: /images/20220312/5735ef6bc70c43959836c66ec360c894.png
[879083-20170207230540447-243311804.png]: /images/20220312/27540f0e69a045319b68738f1943a86a.png
[879083-20170207230610244-2092824246.png]: /images/20220312/f8c4a087ca8247eda6aa78693fc46ede.png
[https_www.cnblogs.com_sylvenas_p_6376300.html]: https://www.cnblogs.com/sylvenas/p/6376300.html