说说我自己在window10上配置React Native 的过程和所遇到的坑

经过昨天一天和今日上午的努力,终于是把React Native的环境给配置好了,windows里配置的坑还真是多,但是经过各种困难后成功的那种成就感让我觉得之前所做的都是值得的,所以在这里分享一点自己的经验给大家,希望大家可以少走一点弯路。

1. 首先得先安装JDK,然后配置JDK的环境,将JDK的bin目录加入系统PATH环境变量

推荐1.8以上的版本






2. 然后安装一些必须的软件 详情请看http://reactnative.cn/docs/0.28/getting-started.html#content

1)首先是Chocolatey,以管理员的身份打开命令提示符窗口,就是cmd


运行

@powershell -NoProfile -ExecutionPolicy Bypass -Command "iex ((new-object net.webclient).DownloadString('https://chocolatey.org/install.ps1'))" && SET PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin

2)然后在在cmd里输入

choco install python2
安装Python2


3)在cmd里输入运行

choco install nodejs.install
安装NodeJS,我是之前装过,所以这一步省略了


4)安装React Native命令行工具(react-native-cli)

在cmd里输入运行

npm install -g react-native-cli


先说好,要是以上安装过程有一步没有通过,一定要去官网看看有哪些问题,或者

百度看看其他伙伴安装时是否有同样问题,不然后面又会遇到无数的坑。


3.安装Android SDK

这一步先把Android Studio更新到2.0以上,再安装SDK,而且有几个必须要安装的

SDK Platforms窗口中,选择Show Package Details,然后在Android 6.0 (Marshmallow)中勾选Google APIsIntel x86 Atom System ImageIntel x86 Atom_64 System Image以及Google APIs Intel x86 Atom_64 System Image

SDK Tools窗口中,选择Show Package Details,然后在Android SDK Build Tools中勾选Android SDK Build-Tools 23.0.1,而且必须是23.0.1


4.然后就是配置ANDROID_HOME的环境变量。

先在你的环境变量里新增ANDROID_HOME,

下面填上你的sdk的路径



然后再在Path里新增以下四个

%ANDROID_HOME%;

%ANDROID_HOME%\platforms;

%ANDROID_HOME%\platform-tools;

%ANDROID_HOME%\tools;


5. 然后可以在cmd里运行

react-native init 项目名

项目名自己取 但首位最好是字母,别弄些数字上去,也别用汉字
然后这个过程大概要20分钟,请耐心等候一下...


完成后就可以cd 进你的项目


连接手机,手机一定要在开发者选项里打开usb调试,

cmd输入adb devices 看看是否有东西,如图:


有就可以运行 react-native run-android 或

react-native run-ios 看你的模拟器或真机是哪个系统


6. 然后这里我的问题就出来了



AAPT out... NO Delegate set...

一开始不知道为什么,仔细检查安装过程,看看有没有漏掉的。

结果后来,把项目从C盘移到其他盘 这个问题就消失了


紧接着,以为见证奇迹的时刻到了,结果出现




后面还有一串信息:
What went wrong:
Execution failed for task ':app:installDebug'.
> com.android.builder.testing.api.DeviceException: com.android.ddmlib.InstallException: Failed to establish session


这种问题就是国产手机自己的问题,东西打包好了,安不上去,怪谁

我的解决办法就是直接把APK通过QQ发到手机上去,手机接收后安装

APK在你的项目里,比如我的项目是FirstProject

那么APK就在 FirstProject\android\app\build\outputs\apk里,选第一个


7. 最后输入react-native start 打开服务器

手机打开APP,这里要是白屏就在管理权限里打开你这个APP的悬浮窗权限

就会出现


然后设置端口,当然我这个是设置过的

摇一摇手机,出现个弹出框


点击Dev Settings


然后点击Debug server host & port for device

出现



输入你电脑的ip和8081端口,注意手机和电脑必须在一个局域网下。

再Roload一下,就成功了







  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值