正文 

当前位置： 首页 > java > java教程

react-native学习笔记--史上最详细windows版本搭建安装reactnative环境配置

深入学习ing 深入学习ing     2022-08-19     722

关键词：

参考：http://www.lcode.org/react-native/

React native中文网：http://reactnative.cn/docs/0.23/android-setup.html#content

1、安装Jdk（最好默认安装路径尽量别改）

http://jingyan.baidu.com/article/a24b33cd59b58e19fe002bb9.html

http://www.jb51.net/article/36811.htm（三个环境变量都配置）

 Java SE Development Kit 8u77 Windows x64187.31 MB  jdk-8u77-windows-x64.exe（64位）亲测——必须安装到磁盘根目录

2、安装SDK

最快的方式就是拷同事已经安装好的sdk（如果自己下载的话解决sdk更新慢FQ问题：http://androiddevtools.cn/）

命令行运行adb检测sdk安装成功否

3、安装node.js

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

一路下一步无需配制环境变量点击安装后

node -v的命令来测试NodeJS是否安装成功

4、安装git

下载地址：https://git-for-windows.github.io/

需要配置环境变量参考http://jingyan.baidu.com/album/9f7e7ec0b17cac6f2815548d.html?picindex=1

5.安装react-native命令行工具react-native-cli

git配置完成后可以clone React-native-cli了，建议大家到将react-native-cli克隆到某个盘，不要在c盘直接clone

1)   在命令行中进入你希望RN安装的目录

2)   输入git clone https://github.com/facebook/react-native.git，等待下载

3） 进入刚刚目录下的react-native目录下的react-native-cli目录，输入npm install -g

安装好之后，可以命令行下就有react-native命令了

6.创建RN项目

进入你希望创建项目的目录后，输入react-native init AwesomeProject，等待一段时间（较慢）

成功后目录结构

 

 

7.运行package

在命令行中进入项目目录，输入react-native start，等待一段时间：成功后

这时候可以用浏览器访问http://localhost:8081/index.android.bundle?platform=android，如果可以访问表示服务器端已经可以了。

 

 

8. 安装Genymotion（忽略-不用管）

Genymotion是一个第三方模拟器，它比Google官方的模拟器更易设置且性能更好。但是，它只针对个人用户免费。如果你想使用Google模拟器，请往下看。

  1. 下载并安装Genymotion。
  2. 打开Genymotion。如果你尚未安装VirtualBox，它有可能会提示你安装。
  3. 创建一个模拟器并启动。

虚拟机vm virtualbox启动不了，提示这样的错误，如何解决？

不能为虚拟电脑 Custom Phone - 4.1.1 - API 16 - 768x1280 打开一个新任务.
Unable to load R3 module D:\New Folder/VBoxDD.DLL (VBoxDD): GetLastError=1790 (VERR_UNRESOLVED_ERROR).
返回 代码:    E_FAIL (0x80004005)   
组件:    Console   
界面:    IConsole {8ab7c520-2442-4b66-8d74-4ff1e195d2b6}

 

http://zhidao.baidu.com/question/369440038457309444.html?fr=iks&word=%B2%BB%C4%DC%CE%AA%D0%E9%C4%E2%B5%E7%C4%D4+Google+Nexus+4+-+4.4.4+-+API+19+-+768x1280+%B4%F2%BF%AA%D2%BB%B8%F6%D0%C2%C8%CE%CE%F1.++Unable+to+load+R3+module+E%3A%5CVB%2FVBoxDD.DLL+%28VBoxDD%29%3A+GetLastError%3D1790+%28VERR_UNRESOLVED_ERROR%29.++%B7%B5%BB%D8+%B4%FA%C2%EB%3AE_FAIL+%280x80004005%29+%D7%E9%BC%FE%3AConsoleWrap+%BD%E7%C3%E6%3AIConsole+%7B872da645-4a9b-1727-bee&ie=gbk

9.运行项目

（先用数据线连接手机，打开开发者模式，点击允许USB安装。  本人MI5手机，在运行项目安装apk时报错，需要关闭：弃用MIUI优化，具体请参考文章：

react-native学习笔记--首次安装apk到小米5报错

）

刚刚运行package的命令行不要关闭，重新启动一个新的命令行，

进入项目目录，输入react-native run-android

等待运行(如果是第一次运行，首先会下载gradle，时间较长)

运行成功后出现下图

 

 

10.第一次手机肯定报错

 

 

点击Dev Settings后，点击Debug server host & port for device,设置IP和端口

 

 

这里的IP是电脑的IP，不知道的可以在命令行中输入ipconfig进行查询，端口号固定8081

 

 

设置完成后，回到空白页面，再次摇一摇手机，选择Reload JS，程序就运行起来，出现Welcome to React Native！

 

 

 

 

 

 

史上最详细的maven使用笔记（建议收藏）(代码片段)

Maven🍅Java学习路线：搬砖工的Java学习路线🍅作者：程序员小王🍅程序员小王的博客：https://www.wolai.com/wnaghengjie/ahNwvAUPG2Hb1Sy7Z8waaF🍅扫描主页左侧二维码，加我微信一起学习、一起进步🍅欢迎... 查看详情

史上最详细windows版本搭建安装reactnative环境配置

...境搭建以及reactnative入门学习资料请移步:http://www.lcode.org/react-native/刚创建的ReactNative技术交流3群(4965087 查看详情

史上最详细的docker学习手册，请收藏！

大家好，我是飘渺，今天我们来学习一下Docker！一、docker入门docker的安装及入门示例环境准备：docker需要安装在centos764位系统上；docker要求系统内核在3.10以上查看系统内核：uname -r安装命令：yum -y ins... 查看详情

《数据结构与算法》---（哔哩哔哩--王卓老师笔记）史上最详细笔记(代码片段)

目录视频地址：前言1.、数据结构基本概念1.1数据结构研究内容1.2数据、数据元素、数据项和数据对象1.3数据结构1.4数据类型和抽象数据类型（1）什么是数据类型？（2）什么是抽象数据类型？1.5算法与... 查看详情

深度学习为什么选择pytorch？史上最详细pytorch入门教程(代码片段)

目录前言一、Pytorch介绍1.常见的深度学习框架2.Pytorch框架的崛起3.Pytorch与Tensorflow多方位比较二、Tensors1.Tensor的创建2.Tensor的操作3.Tensor与Numpy三、Autograd的讲解1.模型中的前向传播与反向传播2.利用autograd计算梯度四、构建神经网络... 查看详情

史上最详细github使用教程（英文烂的血泪史）

前言： 最近在学习github，  英文不好的我看着头疼。网上的教程也不够详细。 仅以此文献给没过四级的丸子们。。。没有排版将就着看。。。 使用github 目的：托管项目代码 基本概念：仓库（Repository... 查看详情

python爬虫入门到实战-史上最详细的爬虫教程

马哥高薪实战学员【Python爬虫入门到实战-史上最详细的爬虫教程，限时免费领取】爬虫分类和ROBOTS协议爬虫URLLIB使用和进阶爬虫URL编码和GETPOST请求 查看详情

python爬虫入门到实战-史上最详细的爬虫教程

马哥高薪实战学员【Python爬虫入门到实战-史上最详细的爬虫教程，限时免费领取】爬虫分类和ROBOTS协议爬虫URLLIB使用和进阶爬虫URL编码和GETPOST请求 查看详情

kafka史上最详细原理总结

Kafka史上最详细原理总结一、概念理解（1）产生背景（2）Kafka的特性（3）Kafka场景应用（4）Kafka一些重要设计思想二、消息队列通信的模式（1）点对点模式（2）发布订阅模式三、Kafk... 查看详情

史上最详细的sqlmap使用教程(代码片段)

史上最详细的sqlmap使用教程1.sqlmap简介2.初级扫描方案探测是否存在sql注入漏洞查看数据库信息3.高级扫描方案绕过waf探测等级和危险等级(—level—risk)伪造HttpReferer头部执行指定的SQL语句(—sql-shell)执行操作系统命令(—os-shell)读... 查看详情

spark运行原理史上最详细

https://blog.csdn.net/lovechendongxing/article/details/81746988Spark应用程序以进程集合为单位在分布式集群上运行，通过driver程序的main方法创建的SparkContext对象与集群交互。1、Spark通过SparkContext向Clustermanager(资源管理器)申请所需执行的资源... 查看详情

gradle史上最详细解析

前言对于Android工程师来说编译/打包等问题立即就成痛点了。一个APP有多个版本，Release版、Debug版、Test版。甚至针对不同APPStore都有不同的版本。在以前ROM的环境下，虽然可以配置Android.mk，但是需要依赖整个Android源码，而且还... 查看详情

kafka史上最详细原理总结

Kafka是最初由Linkedin公司开发，是一个分布式、支持分区的（partition）、多副本的（replica），基于zookeeper协调的分布式消息系统，它的最大的特性就是可以实时的处理大量数据以满足各种需求场景：比如基于hadoop的批处理系统、... 查看详情

kafka史上最详细原理总结

Kafka是最初由Linkedin公司开发，是一个分布式、支持分区的（partition）、多副本的（replica），基于zookeeper协调的分布式消息系统，它的最大的特性就是可以实时的处理大量数据以满足各种需求场景：比如基于hadoop的批处理系统、... 查看详情

史上最详细的xgboost实战

接下来安装，并最终选择将Python加入环境变量中。安装依赖包去网址：http://www.lfd.uci.edu/~gohlke/pythonlibs/中去下载你所需要的如下Python安装包：numpy-1.13.1+mkl-cp36-cp36m-win_amd64.whlscipy-0.19.1-cp36-cp36m-win_amd64.whlxgboost-0.6-cp36-cp36m-w 查看详情

史上最详细windows下安装binwalk

1.https://github.com/ReFirmLabs/binwalk到这里下载binwalk，下载后解压。2.找到下载后的文件夹，在这里要进行安装步骤，一边按着shift，一边按着鼠标右键，点击在此处打开命令窗口。输入pythonsetup.pyinstall安装完成：3.去到你的python安转... 查看详情

史上最详细的接口测试

目录序什么是接口为什么做接口测试接口测试的模板接口的构成http常用的请求方式接口测试的重点接口测试的质量评估标准接口模拟测试http状态码列表序大多数人对于接口测试都觉得是一种高大上的测试，觉得学会接口测试就... 查看详情

pytest文档13-allure2生成html报告(史上最详细)

前言allure是一个report框架,支持java的Junit/testng等框架,当然也可以支持python的pytest框架，也可以集成到Jenkins上展示高大上的报告界面。环境准备1.python3.62.windows环境3.pycharm4.pytest-allure-adaptor5.allure2.7.06.java1.8**作者：上海-悠悠QQ交流... 查看详情