在windows下搭建React Native开发环境之--翻车记

react native环境搭建并不难,就是烦琐,坑也多。我只想说环境搭建我用了两天快哭了,都是我电脑太垃圾了,最后还重装系统微笑,环境需要配置的东西太多。

首先来说下具体需要配置哪些软件:

1)jdk安装----以及环境配置(最好是1.8以上

2)sdk安装(安装Android studio就可以了(好像大概可能要安装23.0.1的sdk尴尬))---以及环境配置

3)git安装---环境配置,默认安装路径不需要配置

4)node安装---环境配置(配置淘宝镜像)

5)python安装---环境配置

6)yarn安装---环境配置

以上就是在使用react-native环境之前需要配置的基础环境,不要急一个一个慢慢装。具体的地址和环境变量配置,这里就不多说了,随便一搜都有很多,安装完之后到cmd窗口中version一下 看看是不是能够正常使用。

主要讲一下rn环境配置:

1.安装node

node.js轻量级的Web服务器,想要是React Native跑起来需要安装node

下载地址:https://nodejs.org/en/

而且最好配以下淘宝镜像如果不翻墙的话,淘宝镜像就是国外的网站我们国内访问的非常非常慢,然后淘宝翻墙之后在自己服务器上实时同步一些数据给我们国内网站访问。

下载安装好之后可以使用node -v命令查看是否安装成功


关于淘宝镜像配置:

如图在对于的node下增加一个  ".npmrc"文件



文件内容:



phantomjs_cdnurl=http://cnpmjs.org/downloads
sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
registry=https://registry.npm.taobao.org

2.安装git

安装git为我们同步rn项目的时候使用,下载地址:https://git-for-windows.github.io/ 安装完之后配置一下环境变量。




一直下一步下一步即可。。。。。

3.安装yarn

yarn是一个可以同步全球代码的一个软件,只要安装上我们在同步 rn project 时候就非常简单,直接在cmd窗口就能直接同步项目。。

下载地址:https://yarnpkg.com/zh-Hans/

直接安装就行没什么特别的。。。

4.安装 react-native的 cli

我刚开始看了很多博客上都说:git安装完之后就去 git clone https://github.com/facebook/react-native.git但是我们在cmd或者git窗口

运行,同步项目,非常慢,最后同步不下来项目,,就报错误提示




一直同步不了项目,,也许是我的方式不对,或者要翻墙。。

所以我采用了不同的方式

最简单的方式运行命令:

npm install -g react-native-cli   官网命令

之后我们就可以使用 react-native 的命令来工作了。。。

5.创建 rn 项目

以上基本我们的环境算是配好了,,接下来就是要创建我们的rn项目了,在一个单独的文件夹下打开我们的当前路径下的窗口运行创建项目命令:

react-native init AwesomeProject

项目创建完成之后,进入项目的根目录,运行项目,命令:

react-native run-android

这个时候回弹出两个窗口,一个是node服务器,一个是我们安装apk的进度。。


以上任何一个过程都有可能出现错误,这个时候要根据错误提示,具体做出解决方案,,,一般错误,sdk找不到啦,找不到手机啦,等等。


遇到的错误:

1.手机连接不上电脑usb

我想说为了这个原因我从装了系统大哭,有个端口一直被占用5037这个端口,,一直在排查为什么连接不上,是哪个进程占用了这个端口,,对应的 pid 找不到试了很多方法最后把能解决问题的方案写下:

解决方案:

1.在电脑上安装一个360手机管家,其实有时候我们连接不上的端口,第三方软件还是有作用的,哈哈大笑

发现还是连不上。。。。。。。。。。下面。。。。

2.先cmd打开窗口:adb kill-server

                                    adb start-server

3.继续尝试 :adb devices 看看能不能连接。。


2.运行项目找不到sdk:

把项目导入到,Android studio 中自动回吧你的sdk给你修改到,对应的目录索引下。。。。。。。。。


windows下安装环境就到这里了,接下来就要开始搞事情了。。。。。。。。


阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/WangRain1/article/details/80316014
个人分类: React Native 新司机
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

不良信息举报

在windows下搭建React Native开发环境之--翻车记

最多只允许输入30个字

加入CSDN,享受更精准的内容推荐,与500万程序员共同成长!
关闭
关闭