RISC-V生态开发套件解析(八):Waft模拟器和dep_tools网页版使用教程

简介: 随着RISC-V生态的蓬勃发展,相关开源开发套件也开始逐渐丰富。为了帮助开发者快速了解、玩转新推出的RISC-V开发套件,OCC推出RISC-V生态开发套件解析系列内容,详细讲解生态开发套件的功能特点与上手教程。

编辑语:

随着RISC-V生态的蓬勃发展,相关开源开发套件也开始逐渐丰富。为了帮助开发者快速了解、玩转新推出的RISC-V开发套件,OCC推出RISC-V生态开发套件解析系列内容,详细讲解生态开发套件的功能特点与上手教程。


通过上期内容的学习,相信广大开发者对于如何实现waft应用开发有了更清晰的认识。为了提升waft应用的开发效率,本期我们将带大家一起学习如何使用模拟器和dep_tools网页版。


01 模拟器使用


waft应用现在可以脱离设备,运行在pc端上的模拟器。这标志着waft应用开发又提效了,开发者可以在pc模拟器上调试好应用开发,页面调试,然后在真机上运行。下面介绍模拟器的使用。


1.准备工作


确保安装了npm cli工具,安装方法参考waft基础教学一,下载waft-ui组件demo仓库。


2.使用模拟器


我们进入下载的waft-ui组件仓库。


cd ~/waft-ui


拉起cli,运行npm start


npm start


这时会进入命令行交互界面


waft>


编译我们的waft-ui,


.build --aot=true --aotTarget=riscv64


或者直接


.build


前者会编译aot版本的waft应用,后者只编译wasm字节码


最后用模拟器加载字节码


.simulator --width=800 --height=480 --wasm=build/app.wasm


3.效果展示

image.gifimage.gif图片.png图片.png


02 dep_tools网页版使用


1.准备工作


确保安装了npm cli工具,安装方法参考waft基础教学一;


2.拉起dep_tools网页界面


进入我们的waft工程(自己建的或者通过下载的waft-ui工程均可)。


执行如下命令:


npm start


此时终端会出现以下信息:


image.gif图片.png


浏览器会自动打开页面(建议将chrome设置为默认浏览器)。


image.gif图片.png


页面默认是真机设备界面,此时,pc端是一个server。除了连接真机设备调试,还可以选择模拟器设备。


image.gif1.png


点击“启动&重启”,即可看到模拟器加载的wasm页面。


image.gif图片.png

3.查看dom树


我们还可以在页面上查看dom树的结构,


image.gif图片.png


在Console项还可以查看log


4.调试


我们还可以修改前端页面,快速在模拟器中查看效果。点击右上角的调试:

image.gif


点击调试,会生成wasm文件,并让模拟器自动加载build/目录下的app.wasm文件。


5.连接真机


网页版除了与模拟器能配合工作外,当然支持真机调试。选项切回真机设备,此时会看到server的ip地址,

2.png


通过adb shell命令登入设备。确保当前没有运行的waft_app,执行以下命令,杀死进程。


killall -9 waft_app


然后执行如下命令:


waft_app /waftapps/app_wifi.wasm 30.250.152.206 8030


连接成功后如下:

图片.png


其他操作跟模拟器一样。在推送新包时,记得勾选下面选项

图片.png


03 下期预告


本期是Waft基础教程的完结篇,有关Waft的学习与初步应用就先介绍到这里。下期内容我们将开启对这款RISC-V生态软件的组件学习,欢迎大家持续关注RISC-V生态开发套件系列内容。

相关文章
|
9天前
|
数据可视化 测试技术 API
前后端分离开发:如何高效调试API?有工具 vs 无工具全解析
在前后端分离的开发模式中,API 调试的效率直接影响项目的质量和交付速度。通过本文的对比分析,我们可以看到无工具调试模式虽具备灵活性和代码复用能力,但在操作便利性和团队协作上稍显不足。而传统的外部调试工具带来了可视化、高效协作与扩展性,却可能存在工具切换带来的开发链路断层问题。Apipost-Hepler 融合了两者的优势,让开发者无需离开熟悉的 IDEA 环境,就能享受可视化调试工具的强大功能。
40 5
|
12天前
|
索引
【Flutter 开发必备】AzListView 组件全解析,打造丝滑索引列表!
在 Flutter 开发中,AzListView 是实现字母索引分类列表的理想选择。它支持 A-Z 快速跳转、悬浮分组标题、自定义 UI 和高效性能,适用于通讯录、城市选择等场景。本文将详细解析 AzListView 的核心参数和实战示例,助你轻松实现流畅的索引列表。
33 7
|
10天前
|
移动开发 前端开发 JavaScript
从入门到精通:H5游戏源码开发技术全解析与未来趋势洞察
H5游戏凭借其跨平台、易传播和开发成本低的优势,近年来发展迅猛。接下来,让我们深入了解 H5 游戏源码开发的技术教程以及未来的发展趋势。
|
11天前
|
数据采集 存储 数据库连接
Requests与BeautifulSoup:高效解析网页并下载资源
Requests与BeautifulSoup:高效解析网页并下载资源
|
15天前
|
域名解析 弹性计算 负载均衡
新手上云教程参考:阿里云服务器租用、域名注册、备案及域名解析流程图文教程
对于想要在阿里云上搭建网站或应用的用户来说,购买阿里云服务器和注册域名,绑定以及备案的流程至关重要。本文将以图文形式为您介绍阿里云服务器购买、域名注册、备案及绑定的全流程,以供参考,帮助用户轻松上手。
|
24天前
|
存储 人工智能 程序员
通义灵码AI程序员实战:从零构建Python记账本应用的开发全解析
本文通过开发Python记账本应用的真实案例,展示通义灵码AI程序员2.0的代码生成能力。从需求分析到功能实现、界面升级及测试覆盖,AI程序员展现了需求转化、技术选型、测试驱动和代码可维护性等核心价值。文中详细解析了如何使用Python标准库和tkinter库实现命令行及图形化界面,并生成单元测试用例,确保应用的稳定性和可维护性。尽管AI工具显著提升开发效率,但用户仍需具备编程基础以进行调试和优化。
222 9
|
23天前
|
存储 弹性计算 人工智能
阿里云发票申请图文教程及常见问题解析
在购买完阿里云服务器或者其他云产品之后,如何申请发票成为了许多用户关注的焦点。尤其是对于初次购买阿里云服务器的用户来说,发票申请流程可能并不熟悉。本文将为大家详细介绍阿里云服务器购买之后如何申请发票,以及申请过程中可能遇到的常见问题,帮助大家轻松完成发票申请。
|
1月前
|
弹性计算 运维 网络安全
阿里云轻量应用服务器产品解析与搭建个人博客网站教程参考
轻量应用服务器(Simple Application Server)作为阿里云面向单机应用场景推出的云服务器产品,以其一键部署、一站式管理、高性价比等特性,深受个人开发者、中小企业及入门级用户的喜爱。本文将全面解析阿里云轻量应用服务器的产品优势、应用场景、使用须知,以及使用轻量应用服务器搭建个人博客网站的详细教程,帮助用户更好地了解和使用这一产品。
|
2天前
|
算法 测试技术 C语言
深入理解HTTP/2:nghttp2库源码解析及客户端实现示例
通过解析nghttp2库的源码和实现一个简单的HTTP/2客户端示例,本文详细介绍了HTTP/2的关键特性和nghttp2的核心实现。了解这些内容可以帮助开发者更好地理解HTTP/2协议,提高Web应用的性能和用户体验。对于实际开发中的应用,可以根据需要进一步优化和扩展代码,以满足具体需求。
41 29
|
4月前
|
监控 Java 应用服务中间件
高级java面试---spring.factories文件的解析源码API机制
【11月更文挑战第20天】Spring Boot是一个用于快速构建基于Spring框架的应用程序的开源框架。它通过自动配置、起步依赖和内嵌服务器等特性,极大地简化了Spring应用的开发和部署过程。本文将深入探讨Spring Boot的背景历史、业务场景、功能点以及底层原理,并通过Java代码手写模拟Spring Boot的启动过程,特别是spring.factories文件的解析源码API机制。
145 2

热门文章

最新文章

推荐镜像

更多