React-Native项目之环境配置及调试中的bug

使用React Native开发Android手持机 设备与技术栈 Android手持机 手持机型号iData95W,版本为Android4.4.2,有读RFID和扫条码的模块。 RFID模块用到了厂商提供的jar包和so文件。 扫条码模块用的是广播的方式。 技术栈 react native 与原生Android的交互,js端调用native端,native端主动发消息给js端。 Android调用RFID与扫码模块。 reac... 阅读详情

React-Native环境配置

主要针对Windows系统,以及Android设备调试

准备软件

  1. NodeJs安装包(Node版本要求:>=8.3) node下载
  2. Python安装包(版本要求:必须为Python2) Python2下载
  3. JDK软件(版本要求:>=8) JDK下载
  4. Android Studio安装包(默认为最新) Android Studio下载
  5. 夜神安卓模拟器 夜神模拟器下载

开始安装

  1. 下载好的NodeJs安装,建议直接默认路径。安装完毕之后,打开终端执行
    node -v和npm -v命令,检查安装成功

    顺便执行命令npm install -g react-native-cli 或者yarn global add react-native-cli

  2. 安装Python,直接打开软件包,安装即可。

    配置环境变量:

    1. 打开命令窗口(cmd),输入path=%path%;C:\Python

      C:\Python是Python的安装目录

    2. 打开系统变量下面的path,添加;D:Python32。;为英文状态
    3. 设置完成之后,在cmd命令行,输入python,有相应显示显示内容

    当然也可以通过Chocolatey来安装,由于之后软件比较大,使用该命令容易失败,暂不做详述。

  3. 安装JDK

    具体安装

    1. 建议默认路径安装,下一步式安装即可
    2. 环境变量配置
      1. 打开系统环境变量,设置3项属性,JAVA_HOME、PATH、CLASSPATH(大小写无所谓),若已存在则点击"编辑",不存在则点击"新建"。

        变量名:JAVA_HOME
        变量值:C:\Program Files (x86)\Java\jdk1.8.0_91

        要根据自己的实际路径配置

        变量名:CLASSPATH
        变量值:.;%JAVA_HOME%\lib\dt.jar;%JAVA_HOME%\lib\tools.jar;

        记得前面有个"."

        变量名:Path
        变量值:%JAVA_HOME%\bin;%JAVA_HOME%\jre\bin;

    3. 测试JDK是否安装成功
      运行cmd命令行,输入java -version、java、javac,显示以下信息,说明配置成功
      JDK配置成功
  4. 安装Android Studio
    直接下一步安装即可,安装完成之后运行Android Studio

    1. 配置Android SDK,打开Configure,选择SDK Manager
      SDK Manager
    2. 打开SDK Tools,Show Packager Details,勾选需要的版本(28.0.3+),应用下载即可
      SDK Tools
    3. 配置ANDROID_HOME环境变量
      ANDROID_HOME
    4. 配置platform-tools
      platform-tools
      5.夜神安卓模拟器安装

      相比于Android Studio,推荐使用,安装简单,开发占用资源更少

RN项目开发

  1. 运行react-native init [项目名],安装项目
  2. 安卓模拟器调试
    1. Android Studio

      打开项目目录下的Android目录,运行AVD Manager,在项目中执行react-native run-android,即可运行在模拟器上。

      运行AVD Mnager,有的电脑会提示"VT-x is disabled in BIOS",如下图:
      VT-x
      解决办法:需要进入的电脑的BIOS中修改,重启电脑,进入BIOS页面(一般在开机时按Del或F2,根据电脑不同,进入方式不同),找到Advanced Mode –> Advanced –> CPU Configuration –> Intel Virtual Technology设置为Enabled(表示开启虚拟化)

    2. 夜神模拟器

      1. 更新nox_adb.exe文件,确保和sdk版本一致,将sdk的adb.exe复制到夜神安装处更名为nox_adb.exe替换原文件

        adb.exe文件位于SDK安装目录下面的platform-tools下,
        nox_adb.exe文件位于Nox安装目录下的bin下

      2. 项目和夜神模拟器连接。项目根目录下执行adb devices,查看连接设备,如果没有去夜神模拟器bin目录下,执行adb devices,重新开启后台程序。并在项目根目录下连接,执行adb connect 127.0.0.1:62001。运行项目react-native run-android
  3. 安卓真机调试
    1. usb线连接电脑,打开设置 > 系统 > 开发人员选项 > 打开usb调试。若没有开发人员选项,打开关于手机 > 版本号(连续点击)
    2. 项目根目录运行react-native run-android

      项目运行时报错,ADB Android Device Unauthorized

      1. 检查授权
        <ANDROID_SDK_HOME>\platform-tools>adb devices
        List of devices attached
        4df798d76f98cf6d        unauthorized
        
      2. 撤销USB调试授权

        安卓手机设置 > 系统 > 开发人员选项

      3. 重启adb服务
        adb kill-server
        adb start-server
        
      4. 重连设备
        手机询问电脑同意连接,同意确认
      5. 检查设备 adb devices
React Native操作指南:使用Expo快速启动项目 掌握React Native开发,从使用Expo快速搭建项目开始。无需配置,一键初始化应用,极大提升开发效率,是React Native开发者不可或缺的实用技巧。 阅读详情

相关推荐

React Native实战:从环境搭建到项目上线的完整避坑指南

跨平台移动应用开发是当前移动开发领域的重要技术方向,它允许开发者使用单一代码库构建同时运行在iOS和Android平台的应用,大幅提升开发效率并降低维护成本。其核心原理是通过JavaScript桥接原生组件,实现接近原生性能的用户体验。这项技术的核心价值在于平衡开发效率与应用性能,尤其适合需要快速迭代、团队资源有限的中大型项目。在实际工程实践中,环境配置、项目结构设计、状态管理策略和性能优化是决定项目成败的关键环节。本文聚焦React Native开发中的常见陷阱,例如Windows系统下的260字符路径限

weixin_29009501的博客 269

Xcode中的各种警告以及处理方法

从sdk3.2.5升级到sdk 7.1中间废弃了很多的方法,还有一些逻辑关系更加严谨了。 1,警告:“xoxoxoxo”  is deprecated 解决办法:查看xoxoxoxo的这个方法的文档,替换掉这个方法即可。 2,警告:Declaration of "struct sockaddr" will not be visible outside of this function

NoPolun_iOS的博客 2972

金蝶ERP元数据解析:字段属性与表结构映射实战

本文深入解析金蝶ERP元数据的核心价值与应用实践,详细介绍了字段属性与表结构映射的关键技术。通过缓存获取与工具类直连两种方案对比,结合实际案例展示元数据在数据库校验、动态表单生成等场景的应用,帮助开发者高效解决二次开发中的常见问题。

weixin_33738555的博客 434

Xcode创建的工程使用xcodebuild命令行编译

Xcode创建的工程使用xcodebuild命令行编译 1、确保xcodebuild能够正常运行 如果使用xcodebuild命令出现如下错误: could not stat active Xcode path '/Volumes/Xcode/Xcode.app/Contents/Developer'. (No such file or directory) 解决办法: xcode-

菜鸟攻城狮 1万+

STM32 HAL库定时器中断里读编码器速度准吗?聊聊MG310电机的测速与防溢出处理

本文探讨了STM32 HAL库在定时器中断中读取编码器速度的精度问题,特别针对MG310电机的测速与防溢出处理提供了解决方案。通过对比定时中断法和编码器模式的性能,揭示了硬件编码器接口在降低误差和CPU占用率方面的优势,并详细介绍了CubeMX配置技巧和防溢出处理的工程实践。

weixin_28720767的博客 401

从图片到3D模型:用Tripo+Unity打造AI建模流水线(避坑指南)

本文详细介绍了如何利用Tripo和Unity构建AI驱动的3D建模流水线,从图片到3D模型的高效转换。通过文生模型和图生模型的双模系统,开发者可以大幅提升建模效率,适用于游戏开发和数字内容创作。文章还提供了环境配置、图片预处理、批量生成等实用技巧,帮助开发者避开常见陷阱。

weixin_27024175的博客 616

reactNative配置过程中出现的各种问题

reactnative的中文网站:https://reactnative.cn/docs/getting-started/ 前面安装配置的步骤里面有 下面就看下配置过程中出现的问题 1,react-native run-android 下载gradle下载极慢 解决办法,直接去网站下载对应版本 https://services.gradle.org/distributions/ 然后解压在对应目录...

qq_44361433的博客 292

【推荐系统】推荐算法:冷启动-召回-粗排-精排-重排 解读

【推荐系统】推荐算法:冷启动-召回-粗排-精排-重排 解读

Danger的博客 3761

iOS 自动构建命令——xcodebuild

想想当初天天来到公司,每天需要做一件事就是打开Xcode打包ipa,上传到fir。日复一日月复一月年复一年的做着同样的事情,作为有志成为优秀工程师的我来说,这是必须要解决的问题,所以决定自动化解决问题。 简介 xcodebuild 是苹果发布自动构建的工具。它在一个Xcode项目下能构建一个或者多个targets ,也能在一个workspace或者Xcode项目上构建scheme,总的来说,用它没错就是了。 用法说明 Tips:在终端输入man xcodebuild,可以看到Description

lrbtony的博客 5843

实验7:机器学习油田产量预测-代码数据-完整代码数据可直接运行-计算机毕设

实验7:机器学习油田产量预测-代码数据-完整代码数据可直接运行-计算机毕设

机器学习深度学习业余选手 479

Mamba SSM 实战:IMDb 文本分类 + Mamba-ssm 全流程

Mamba SSM 文本分类链路:IMDb 二分类 → MambaLMHeadModel (d_model=256, n_layer=8, d_state=16, exp2=2) → 末 token 分类头。5 epoch 达 89.2% 准确率 (与 BERT-base 持平), 但显存降低 44% (3.5GB vs 6.2GB)。建议序列长度 ≥ 1024 再选 Mamba, 短序列 (< 512) 用 BERT 更高效。扩展时注意d_state。

m0_71589036的博客 57

uniapp打包ios失败

这个问题是因为HBuilderX3.6.11+版本 调整 Camera&Gallery、Barcode、Orientation、Record等模块从引擎内置调整为独立模块,解决iOS平台隐私合规检测可能报包含麦克风、相机/相册、运动等权限的问题。云端打包默认不再包含以上模块,如需要请手动在 manifest.json -> 模块配置 中勾选。这是因为在manifest.json中配置的icon不符合要求,修改就可以了。报错链接点开是这样的。

m0_66975650的博客 2322

Vue和Vue-Element-Admin(六):集成中的CORS(跨域资源共享)问题

在vue-element-admin登录集成时候碰到跨域资源共享问题,CORS(Cross-origin resource sharing)是浏览器的技术规范,浏览器可以发起跨域请求但Javascript脚本不能,传统的ajax只能获取在同域名下的资源,但Html5允许ajax发起跨域请求,解决方案有:JSONP、Flash、IFrame、CORS。 一、CORS(跨域资源共享)问题 针对vue-element-admin的登录模块的后端接口完成后,前端调用时候出现报错,因为前端的端口是9527而后.

叶子叶来 9615

ReactNative遇到的深坑和搭建项目建构

ReactNative遇到的深坑和搭建项目建构

weixin_44457030的博客 1485

RK平台PCIE-Ethernet扩展:Intel I210移植与性能飞升之路

本文详细介绍了Intel I210千兆以太网控制器在瑞芯微RK平台的移植与优化过程。通过硬件适配、内核配置、驱动开发及性能调优四个关键环节,实现了RK平台的网络性能提升。硬件方面,重点说明了PCIE接口的规范连接与供电检查;软件方面,系统阐述了内核配置、设备树修改和驱动编译流程。在性能优化环节,详细介绍了中断优化、缓冲区设置和TCP/IP协议栈调优策略,并采用Iperf和Netperf工具进行量化测试验证。测试结果显示,优化后的网络吞吐量提升20%以上,延迟降低40%,为工业控制、智能安防等场景提供了可靠的

远程部署调试 运行安装 项目调试 二次开发 项目技术新 持续迭代 部分源码免费分享 352

lwip-2.0.3

lwip是瑞典计算机科学院(SICS)的Adam Dunkels 开发的一个小型开源的TCP/IP协议栈。实现的重点是在保持TCP协议主要功能的基础上减少对RAM 的占用。

react-native-make本地开发指南:贡献代码与插件调试

react-native-make是一套简化React Native开发流程的日常CLI工具集,提供了图标设置、启动屏生成等实用功能。本指南将详细介绍如何在本地环境中搭建开发环境、贡献代码以及调试插件,帮助开发者快速参与到项目贡献中。 ## 🚀 本地开发环境搭建 ### 基础环境准备 在开始贡献代码前,请确保你的开发环境满足以下要求: - Node.js (v14+) 和 npm/yarn

gitblog_01008的博客 734

jdk-8u144-linux-x64.tar.gz.

该资源为搭建Linux系统Java环境用,资源的后缀为tar.gz格式的压缩包

react-native环境配置

一、Node环境安装 下载地址:http://nodejs.cn/download/ 如果用不到最新特性的话,一般选择稳定版本 但是注意,react-native要求:Node 的版本必须大于等于 10 我们点击 Windows安装包,下载完成后双击打开,一路next,最后install就好 这里推荐将安装路径放在C盘根目录,方便查看内容,当然,个人喜好,也可以默认 到此为止,no...

hahahhahahahha123456的博客 990

SAP B1中文培訓教材_SDK

公司内部培训资料,对开发工具 ,DIAPI, UIAPI,Add-ON有详细解说

STM32F407中文手册

STM32f407中文手册 本参考手册面向应用开发人员,提供有关使用 STM32F405xx/07xx、STM32F415xx/17xx、 STM32F42xxx 和 STM32F43xxx 微控制器存储器与外设的完整信息。STM32F405xx/07xx、STM32F415xx/17xx、STM32F42xxx 和 STM32F43xxx 构成一个微 控制器系列,各产品具有不同的存储器大小、封装和外设。有关订购信息以及器件的机械与电气特性,请参见数据手册。有关 ARM Cortex™-M4F 内核的信息,请参见《Cortex™-M4F 技术参考手册》。

React Native 环境搭建, 新建项目, 运行和调试

React Native 可以理解为一个基于 JavaScript, 具备动态配置能力, 面向前端开发者的移动端开发框架. 目前为止虽然一直还没有V1.0.0版本, 但是相信很多小伙伴都了解过或者已经入坑了. 为什么RN那么有人气呢? 我们可以先简单分析一下RN的场景.

Jesse的专栏 2148

React Native 项目环境配置、调试以及打包

去年在做React Native混合开发的时候,写过几篇笔记: react-native对android物理返回键back的监听以及基类封装 react native导航navigator react-native 与安卓端通信 android 端集成react native Fetch 网络请求简单封装,支持超时入口 下面说正题吧!今天客服提了一个去年使用React Native混合...

我弟是个程序员 5559

Bug 大作战:程序员职业生涯中的难忘瞬间

多人协作虽然带来了很多便利,但也带来了一些诡异的 bug。无论是 WPS 文件共享、游戏多人联机还是网易协作,都可能出现各种问题。这些问题提醒我们,在进行多人协作时,要注意选择稳定的软件和平台,做好备份工作,及时沟通解决问题,以确保协作的顺利进行。Bug 是程序员职业生涯中不可避免的挑战。在程序开发的过程中,无论是代码中的逻辑问题、环境配置的困扰,还是多人协作带来的诡异 bug,都让程序员们时刻面临着挑战。Bug 的出现可能导致项目进度延迟、资源浪费,甚至影响产品的质量和用户体验。

zentao_pms的博客 1160

react-native android端开发环境搭建详细教程(android studio + vscode)

1. react-native 开发之前需要掌握的技术 javascript 这个就不用多说了。 ecmascript 6(简称ES6) ES6 是 JavaScript 语言的一种标准 React.js 用于构建界面的 JavaScript 库 Android,ios 原生开发 2. react-native 优缺点 优点: 1.网上资料相对比较多 rn 是由大名鼎鼎的facebook 研发的,是一款在市面上相对比较成熟的一款移动混合开发框架,网上案例资源也比较多,也有比较成...

ericsxd的博客 5785

告别原生模块依赖噩梦:React Native项目中的patch-package进阶实践

在React Native开发中,原生模块(Native Module)兼容性问题常常导致开发停滞。当第三方库或官方模块出现bug时,等待上游修复往往需要数周甚至数月。本文将详细介绍如何使用patch-package(补丁包)工具在React Native项目中实现原生模块的快速修复,避免漫长的依赖等待和复杂的fork流程。 ## 原生模块修复的痛点与解决方案 React Native项目通常

gitblog_00260的博客 510

Android 集成React Native 到现有的项目踩坑记录

集成步骤 官方文档:https://facebook.github.io/react-native/docs/0.54/integration-with-existing-apps 借鉴博客:https://blog.youkuaiyun.com/u012455070/article/details/78926526 (1)配置react-native的开发环境 (2)创建一个react-n...

小人物、平凡,世界很大我只想在家 1479

React-Native入门指南--环境配置

环境配置 1、OS X – 现在这个仓库只包含 iOS 实现,且 Xcode 只能在 Mac 上运行。2、在Mac上安装Xcode,建议Xcode 6.3以上版本3、安装 node,watchman,flow 的推荐方法是 Homebrew。4、brew install node。不知道 node 和 npm5、brew install --HEAD watchman。brew inst

追梦 1622

React Native for OpenHarmony:猜数字游戏完整技术实现文档

在 OpenHarmony 生态快速发展的背景下,React Native for OpenHarmony(RNOH)为前端开发者提供了高效构建跨平台应用的能力。本文以经典的猜数字游戏为案例,深入剖析如何利用 RNOH 技术栈在 OpenHarmony 平台上实现一个功能完整、性能优化、用户体验良好的移动应用。

欢迎大家一起讨论交流 1503

Expo:为什么它能让你5分钟内启动React Native应用开发?[特殊字符]

你是否曾经因为React Native复杂的原生环境配置而望而却步?或者被iOS和Android双平台开发的繁琐流程搞得焦头烂额?Expo正是为了解决这些问题而生的开源框架,它让跨平台移动应用开发变得前所未有的简单和高效。 ## 核心亮点:为什么开发者都爱用Expo? ### 一站式解决方案,告别环境配置烦恼 Expo最大的优势在于它提供了一整套完整的开发工具链。你不需要单独安装Androi

gitblog_00534的博客 718
上一篇: react系列之react-redux
下一篇: 网页中链接实现打印功能
海阳盼
博客等级 码龄11年 11粉丝 22原创
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值