Windows 下 React native android 环境搭建

Posted 2022-12-05 wukj_litai

昨天不是很忙，于是抽空想做个React native app 试试，在搞这个环境的过程中真是一路的坑啊，搞大了大半夜终于算是搞定啊，现在写下我在这过程中遇到的一些坑，后面的朋友就不用在这些坑中纠结了。关于怎么搞这个我也是按照网上网友的博客的内容一步步搞的，也有参考官方的文档，下面是我的踩坑记录。

特别强调啊，没有搞定vpn的还是去搞个vpn 吧，不然这里面会出现很多的问题。

在安装之前我们需要安装jdk,android sdk,关于这个两个的环境变量配置，网上有很多的资料，我在这里就不做叙述了，在这里我们需要配置一个ANDROID_HOME，这个的配置是我遇到的第一个大坑，尝试了很久才搞定，在这里说下我的配置的内容。我是在win 7 64 位下面配置的，配置的内容在下面：

我是Android studio 下面安装的我的sdk ,目录如下所示：

于是我在我的环境变量中进行了下面的设置，注意是环境变量的系统环境变量，进行了添加：

接下来的是 我们需要在 系统环境变量的Path 中添加上我们的tools 工具，我原来只添加了platform-tools ,一直设置不正确，最后我添加了
%ANDROID_HOME;%ANDROID_HOME%\\platform-tools;%ANDROID_HOME%\\build-tools;%ANDROID_HOME%\\tools;都添加到Path 的最前面就可以搞定了。如果接下你在命令行中输入 android -h 和adb shell 会打印一大堆的东西，说明设置路径成功了。

接下来你需要安装Git, node.js 和 Visual studio ，这些的安装没什么需要特别主要的安装就可以了。

接下来需要安装 react-native 命令行，按照官网的方法直接在命令行中进行安装：
设置路径
npm config set registry https://registry.npm.taobao.org –global
npm config set disturl https://npm.taobao.org/dist –global
进行安装
npm install -g react-native-cli。

安装好react-native -cli 之后我们就可以在命令行中操作
react-native init AwesomeProject 来建立你的第一个项目了，这个过程比较缓慢，完成之后，会提示你安装这个应用到模拟器上或者手机上，需要执行 react-native run-android ,接下来会进行很长时间的下载和安装，我在下载和安装中出现了很多的问题，大家在安装的时候碰到什么样的问题可以在网上找找，我在里面碰到的一个错误是这样的，提示安装Debug 错误：

我忘了没有进行截图，我当时的问题我在网上找了好久，最后找到了问题的解决办法，发现和上面描述的问题一样，使用了网友的解决办法：

完美的解决了这个问题，安装好之后，你的手机会是白屏的，什么也没有，这个使用我们可以在我们电脑的浏览器上访问：
http://localhost:8081/index.android.bundle?platform=android
看看是不是访问到打包之后是脚本，如果可以访问到，手机上的白屏也会马上消失出现欢迎界面，就是我们期望的界面：

到这里我们搭建好了我们需要的环境并且运行了我们的第一个应用，在这个过程中还有很多的坑，我在这个里面问题的解答参考到了下面的博客：

http://csbun.github.io/blog/2015/12/starting-react-native-with-android/。

http://www.cnblogs.com/meteoric_cry/p/4874517.html。

http://my.oschina.net/jackzlz/blog/508210。

大家在自己使用的过程需要的地方可以好好的参考这些东西，早点搭建好自己的环境。