踩着坑,刨着土,react native的环境配好了
两天,整整两天!!!顶着两天基本没干别的事情,硬是以一种一头撞南墙上再接着撞的精神把环境配好了,期间各种谷歌和百度,没办法啊,他们要不是windows,要不就是mac,像我一样用Ubuntu的就没有,一把心酸泪啊.但是还好,现在过去了.......
下面我不会告诉你我遇到的各种坑以及怎么填的,而是首先介绍所需要的基本各个软件的作用,以及以后再遇到同类问题时,该以怎样的心态和方式来处理该类问题.
基本软件作用
Android Status
为什么基本所有的教程都建议装这个呢?因为他实在是太好了,为什么这么说呢?
- java开发环境怎么配?
- 各种sdk和其他乱七八糟的软件怎么装?
不用担心,一个Android Status来搞定.其中安装时就会帮你把java所需的各种软件下好,之后你只要找到他下载好的软件,然后设置一些全局变量,如JAVA_HOME
等,这点我是深有体会的,我自己装了一个java 9,各种麻烦不说光其中的依赖就折腾了我一下午,结果柳暗花明又一村,发现Android Status早就帮我装好了,心真的很累......
Genymotion和VirtualBox
虽然推荐使用模拟器来进行开发,但是不知道为什么,我在Ubuntu的系统上开这两个软件跟请祖宗一样,先开Genymotion,报开不了,好,直接去开VirtualBox,开是能开,但是只能开32位Linux的手机???我自己电脑64位的,那就意味者Genymotion上一般的手机我全用不了,最后误打误撞找到一款,可是react native表示我不认识它???Fxxx.最后累绝不爱,果断转真机.
所以,如果你不想折腾这两个东西,其实也是可以的.
react native 环境搭建原理
放心,不是什么很专业的东西,因为我也不会,这里只是告诉你,在环境开发过程中,遇到的问题该怎么找,不要像我牛脾气一犯,两天就没了.
第一步:编译
在这当中,不关你外部设备的任何问题,就是看你react native开发环境有没有配对,比如:
报这样的错误,就是编译出错,注意,一定要看提示!一定要看提示,接着跟着提示去找解决方法,最好的办法是直接谷歌,找到解决方法后就尝试解决当前问题,接着再编译,遇到问题,谷歌,编译,谷歌,编译,直到提示编译成功,但是没有设备连接,这个时候再去连接设备.
这里说一下我的建议:
- 先把JAVA_HOME和ANDROID_HOME设置好,我是Ubuntu系统,需要修改
/etc/profile
文件,不要直接在命令行中使用export JAVA_HOME ''
这样的方式,这只会在当前进程中有效,不会全局生效的,要想全局生效,那就修改/etc/profile
文件,修改好后最好重启一下电脑,我试过不重启,直接运行source /etc/profile
,但是还是存在问题,所以还是重启一下电脑.重启后运行一下echo $JAVA_HOME
,看环境是否配置正确 - 配置好后运行一下
gradle
命令查看一下你的环境配对了没有(如果你没装gradle
,那就装一个),你可能会问,为什么不运行java -v
,我就是运行java -v
正确,但是JAVA_HOME
设置错误,导致编译失败的.还有,把项目下的/android/buil.gradle
中的classpath 'com.android.tools.build:gradle:2.0.0'
的gradle
版本修改成你对应的版本.
到此为止,就是我编译时遇到的坑了.放心,编译只是开胃菜,重点在后头.
第二步:连接手机
由于我用的是真机,所以最好装一个android-tools-adb
,他可以检测当前连接的安卓设备,我当时遇到的问题是Ubuntu操作系统不让我挂载我的老手机(真的很老了,我大一时候买的GT-I9308,连4G都没有),于是解决这个挂载问题,基本又花了我一个下午的时间,最后的解决办法是装一个mtpfs
,再多重启几次电脑,是的,就是多重启几次,那天我下午装完,晚上回去试过,显示无法挂载了,早上来试了,还是报无法挂载,中间为了能让环境变量生效,重启了一次电脑,好了.....只能说一句,你够贱.
第三步:调试代码
我们在上面运行react-native run-android
其实是在编译代码,代码编译成功后就会被下载到手机上,接着就可以按照官网的教程来通过USB或者wifi来调试代码了.由于我的安卓版本是4.3,所以我只能使用wifi来调试,求我的心理阴影面积吧,只能说你穷只能怪自己,回到正题来,这个时候你需要先在电脑上运行一个npm run start
,是不是很眼熟!!!其实就是运行一段package.json
中预先设定好的一个脚本,这个脚本的作用是在自己电脑上开启一个网络服务,端口默认是8081
,你在项目根目录下运行一下就能看见很明显的提示信息的.这里开放这个服务是干什么呢?就是方便设备获取最新的代码,比如我修改了其中一个组件的样式,想看到实际效果,那么我就可以通过这个服务向手机传递一个信号"傻逼,有最新的代码了,给你,重新渲染各个组件,给我以最快速度将效果呈现出来",他的作用就是这个.而且如果你开启了热加载的话,那么这个过程就是全自动的.
意见建议
首先我有点先入为主的观念了,我一直担心手机连接失败问题,没有发现前期其实一直是编译的问题,所以在一个其实可以以后再来解决的问题上花费了很长时间,而且还有一个致命的问题,就是我如果一直在解决手机连接问题,并且使用react-native run-android
来检测我手机连接是否正确,那么我永远也解决不了,因为刚开始的问题就不在那里.
如果你被一个问题卡住,那么可以先放放,可能是你努力错了方向.
接着就是我有点心急了,因为我不喜欢落后的感觉,同组的另外两个开发人员都快开发完一个项目了,我却花了两天时间刚配好环境,其中的效率自然是不可同日而语的,虽然这可以谅解,但是从现实上来看,你其实是浪费了两天时间.
不要长期拘泥于一个难题,而是在自己头脑最清醒时以最好的状态去解决,剩余时间,可以从事别的事情.
最后是我自己给自己加限制了,就是代码其实就在那里,他本身没有任何力量,但是当你被一个问题长期卡住的时候,代码就渐渐有了能令你生气,令你沮丧,甚至是愤怒的力量,尽管他从头到尾就这么静静的躺在你的电脑上.所以,不要自己给自己压力,效率低是事实,老板炒你也是正常的,生气除了让你自己难受之外,别无法他,一个带过我的大哥跟我说过一句话:"程序员最忌焦躁".
还有,最好先学一下原理,如果我能花一天时间老老实实看一下原理,那么我第二天肯定不会这么急着被各种问题包围,而是起码能更加理智,更加自信的去解决更多问题.希望下次自己能从这次教训中学到教训.