hippy 调试demo运行联调-mac环境准备篇

适用对于终端编译环境不熟悉的人看,仅mac端
hippy 调试文档官网地址

前提:请使用node16

联调预览效果图:
预览联调图

编译iOS Demo环境准备

未跑通,待补充

编译Android Demo环境准备

1、正常安装Android Studio

2、下载Android NDK,安装可能会遇到点击没有反应的问题

参考这位大佬的安装:Mac安装NDK android-ndk-r25b-darwin.dmg

3、Android Studio打开项目examples/android-demo,执行项目构建

安装虚拟机器:右侧 - Device Manager,手机连机的虚拟机通过adb的方式会因为未加密链接失败;

3.1 报错sdk没有安装

报错sdk没有安装
安装sdk-参考文档

也可以直接执行:brew install android-sdk

安装后需手动添加环境变量,通常会默认安装在:/Users/用户名/Library/Android/sdk (mac系统中)
重启项目

3.2 报错cmake未找到,但可能已经在安装ios环境的时候安装过,命令行可以查到版本,并也试过添加过local.properties地址

cmake应在sdk下按照提示安装对应版本即可,cmake没安装过时左侧会有一个下载的图标,点击下载即可
cmake安装
重启项目

3.3 报错Task ‘wrapper’ not found in project ‘:example’.
FAILURE: Build failed with an exception.* What went wrong:
Task 'wrapper' not found in project ':example'.* Try:
> Run gradle tasks to get a list of available tasks.
> Run with --stacktrace option to get the stack trace.
> Run with --info or --debug option to get more log output.
> Run with --scan to get full insights.* Get more help at https://help.gradle.orgBUILD FAILED in 245ms

项目代码里没有wrapper相关信息,需要新建,可以新建一个项目粘贴gradle文件夹过来。
在Android Studio中,wrapper是指一个用于管理项目中Gradle构建工具版本的工具。它包括Gradle Wrapper脚本文件和相关的Gradle发行版。使用wrapper可以确保团队成员无需手动安装特定版本的Gradle,而是通过项目中的wrapper自动获取所需的Gradle版本。
Gradle是一种基于Apache Ant和Apache Maven概念的构建自动化工具。它允许开发者定义项目的结构,并使用基于Groovy或Kotlin的领域特定语言来配置项目的构建过程。Gradle广泛用于构建Java、Kotlin和Android应用程序等项目。 它提供了一种灵活且可定制的方式来管理项目的依赖关系、构建过程和部署流程。如果项目中缺少Gradle,构建可能会失败,因为Gradle负责处理项目的依赖关系、编译代码、运行测试和打包应用程序等任务。因此,如果项目依赖于Gradle来构建,没有Gradle将导致项目无法完成构建过程。

重新执行“RUN”

3.4报错:Task ‘prepareKotlinBuildScriptModel’ not found in project ‘:example’.

添加:

task prepareKotlinBuildScriptModel {}

到build.gradle.kts中(仅是个声明,任意位置即可)

3.5 调试页面输入调试地址,Android模拟器访问127.0.0.1(localhost)被拒绝

10.0.2.2是Android模拟器设置的特定ip,是本机电脑的alias。换了之后会出现,点击调试页面是空白,模拟机器上也是空白
调试页面是index.bandle
不符合预期可以出现组件的调试页面:
调试页面是demo

我跑的代码是vue-next,模拟器预览的是react;
怀疑前端项目在运行跟vue-next,react本身应该是没跑起来,不匹配导致的预览时index.bundle,关掉前端项目重启并重新运行android staudio就可以了。
调试页面
被调试页面-热更新后

3.6、连接真机

Android 使用了 adb 的端口映射功能,解决了真机到开发机的通讯问题。由于 ARM 模拟器运行效率问题,更加推荐使用真机进行调试。
安装adb
安装adb之后adb dervices检测不到手机,先检查下是否打开了开发者模式,不只是USB-传输文件
手动打开开发者模式(华为手机)
检测到设备之后,debug会出现device connected的提示,有时候会意外断开,尝试重连通常可以解决

补充信息

安卓的常见结构目录:
安卓的常见结构目录
Android studio默认打包路径是android/app/release和android/app/debug两个文件夹
Android studio默认打包路径

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/500975.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

航拍无人机技术,航拍无人机方案详解,无人机摄影技术

航拍无人机是利用遥控技术和摄像设备,在空中进行拍摄和录像的无人机。这种无人机通常具有高清摄像设备、图像传输设备、GPS定位系统、智能控制系统等,可以轻松实现各种拍摄角度和高度,广泛应用于影视制作、旅游景区航拍、城市规划、环保监测等…

深入理解c指针(六)

目录 九、函数指针数组 1、字符指针变量 2、数组指针变量 3、二维数组传参的本质 4、函数指针变量 4.1 分析《C陷阱和缺陷》中的两端代码 4.2 typedef关键字 5、函数指针数组 6、函数指针数组的用途---转移表 九、函数指针数组 1、字符指针变量 在指针的类型中我们知道…

软考52-上午题-【数据库】-关系模式2

一、关系模式的回顾 见:软考38-上午题-【数据库】-关系模式 二、关系模式 2-1、关系模式的定义 示例: 念法:A——>B A决定B,或者,B依赖于A。 2-2、函数依赖 1、非平凡的函数依赖 如果X——>Y,&a…

AI技术在室内定位的应用

随着科技的不断发展,人工智能(AI)技术已经逐渐渗透到我们生活的方方面面。其中,AI技术在室内定位领域的应用越来越广泛,为我们的生活和工作带来了诸多便利。本文将深入探讨AI技术在室内定位领域的应用,并分…

基于springboot+vue的美食推荐商城

博主主页:猫头鹰源码 博主简介:Java领域优质创作者、CSDN博客专家、阿里云专家博主、公司架构师、全网粉丝5万、专注Java技术领域和毕业设计项目实战,欢迎高校老师\讲师\同行交流合作 ​主要内容:毕业设计(Javaweb项目|小程序|Pyt…

万字带你走过数据库的这激荡的三年

本文收集了卡内基梅隆大学计算机科学系数据库学副教授 Andy Pavlo 从 2021 到 2023 连续三年对数据库领域的回顾,希望通过连续三年的回顾让你对数据库领域的技术发展有所了解。 关于 Andy Pavlo:卡内基梅隆大学计算机科学系数据库学副教授,数…

C++ Python网易云音乐播放器

程序示例精选 网易云音乐播放器 如需安装运行环境或远程调试,见文章底部个人QQ名片,由专业技术人员远程协助! 前言 这篇博客针对《网易云音乐播放器》编写代码,代码整洁,规则,易读。 学习与应用推荐首选。…

深度学习 精选笔记(3)线性神经网络-线性回归

学习参考: 动手学深度学习2.0Deep-Learning-with-TensorFlow-bookpytorchlightning ①如有冒犯、请联系侵删。 ②已写完的笔记文章会不定时一直修订修改(删、改、增),以达到集多方教程的精华于一文的目的。 ③非常推荐上面(学习参考&#x…

MYSQL 解释器小记

解释器的结果通常通过上述表格展示: 1. select_type 表示查询的类型 simple: 表示简单的选择查询,没有子查询或连接操作 primary:表示主查询,通常是最外层的查询 subquery :表示子查询,在主查询中嵌套的查询 derived: 表示派…

vue3使用elementPlus进行table合并处理

elementPlus中table合并部分列 虚拟数据中公司下有多个客户,公司一样的客户,公司列需要合并,客户如果一样也需要合并进行展示,效果展示 const tableData ref([])自定定义自已想要的数据,一般都是通过接口拿到 //table…

Vue3 + xterm + eventSource

xterm 是一个使用 typescript 编写的前端终端组件&#xff0c;可以在浏览器中实现一个命令行终端应用&#xff0c;通常与 websocket一起使用。 一、安装 pnpm install xterm or yarn add xterm or pnpm install xterm二、代码实现: 实现日志展示 <template><a-modal…

08、关于语法:resp?.data?.data 的含义与实际操作中可能遇到的问题

1、数据情况&#xff1a; 其一、从后端拿到的数据为&#xff1a; let resp.data {"data": [],"lag_mode": 3,"totol": 0 }或&#xff1a; let resp.data {"data": [],"totol": 0 }其二、目标数据为&#xff1a; // 想要…