window环境下react-native配置

我用的是公司的电脑,我也不知道之前电脑都配置了那些需要的环境,所以,每个环境的配置之前都检查下是否已经存在。下面是操作步骤。

一、配置JDK环境

怎么查看电脑是否安装过jdk;win + R 然后输入cmd,进入控制台,输入java -version


出现java vesion 的版本号表示安装了jdk。如果没有安装的话可以在下面的地址下载。

JDK下载地址: http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

JDK安装以及环境的配置可以参考:https://jingyan.baidu.com/article/f96699bb8b38e0894e3c1bef.html

怎么检查JDK的环境变量配置是否正确,在cmd中输入 javac, 如果输出帮助则配置成功了的,否则需要重新配置

从上面可以看到,我的电脑的JDK环境没有配置好,照着上面网址提供的方法配置一遍,出现下面的java提示则表示java环境配置好了。


二、下载安装Android SDK

下载地址:http://www.androiddevtools.cn/


下载蓝色的那个sdk,有最新的也可以下载最新的,然后解压,


双击 SDK Manager.exe 文件,会出现下面的界面


勾选,Tools下面的 Android SDK Tools, Android SDK Platform-tools, Android SDK Build-tools, Android 6.0 (可以根据自己手机型号选择),Extras下的 Android Support Repository, Google Repository, Google USB Driver



点击Install 18 packages 那个按钮,弹出框同意一步步下载安装sdk(这里选择的模块多了或少了后面还可以重新下载或卸载)

安装完sdk后需要配置sdk的环境变量,和jdk的配置方法相同,具体的步骤可以参考:

环境配置:https://blog.csdn.net/love4399/article/details/77164500


三、安装nodejs 和git工具


这里我这边都安装了,这两个工具的安装也比较简单,基本都是下载下来一直下一步。

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

node安装方法:https://blog.csdn.net/u010255310/article/details/52205132

git安装下载:https://blog.csdn.net/amberom/article/details/79508116

四、安装react-native

npm install -g react-native-cli

五、创建一个初始的react-native项目

进入你想创建项目的文件夹,运行下面的命令

react-native init projectName


如果安装的特别慢或者不能安装可以用淘宝镜像安装,一样的效果。

npm config set registry https://registry.npm.taobao.org

安装成功后会有下面的提示。


进入项目文件夹,cd rn001, 然后 npm start


在浏览器中输入localhost:8081,会看到 React Native packager is running 


六、真机调试

将手机通过sdk连接电脑,打开一个新的cmd窗口,如果sdk的环境变量配置正确的话,输入adb devices 能看到有个设备名,这里是FMWWC... 


进入该项目文件夹,运行react-native run-android, 系统会下载依赖的jar包等资源


如果有些包不能下载,可以退出再重新运行


最后会报一些错,遇坑则填:


这个是这个项目找不到SDK的路径,可以在项目的android文件夹下新建一个local.properties文件,配置下路径:


再次运行react-native run-android,


这个是前面sdk安装模块的时候少了包,再次打开SDK Manager,勾选Tools中的模块安装:

 

再次运行 react-native run-android 又安装了一堆依赖包


打包完成后出现下面的提示


打开手机能看到:


整个react-native环境配置大概这样,遇到什么错误搜一下,基本都很容易解决。


  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值