【平头哥Sipeed LicheeRV 86 Panel测评】- 3 Waft开发环境的建立
本帖最后由 我爱下载 于 2022-3-16 10:00 编辑<p style="text-align: center;"><strong><span style="font-size:20px;"><span lang="EN-US"><span style="font-family:"Tahoma","sans-serif"">Waft</span></span><span style="font-family:"微软雅黑","sans-serif"">开发环境的建立</span></span></strong></p>
<p> </p>
<p><span style="font-size:22pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif"">1、waft<span style="font-family:"微软雅黑","sans-serif"">介绍</span></span></span></span></p>
<p> </p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">再阿里云网站中，包含</span></span><span lang="EN-US" style="background:white">Waft</span><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">的介绍。</span></span><span lang="EN-US" style="background:white">Waft</span><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">（</span></span><span lang="EN-US" style="background:white">WebAssembly Framework for Things) </span><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">是一个面向</span></span><span lang="EN-US" style="background:white"> AIoT </span><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">的高性能应用研发框架，</span></span><span lang="EN-US" style="font-size:10.5pt"><span style="background:white"><span style="150%"><span style="font-family:"Helvetica","sans-serif""><span style="color:#333333">Waft</span></span></span></span></span><a name="ref__34160812"> </a> <span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">基于</span></span><span lang="EN-US" style="background:white"> WebAssembly </span><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">和自研的渲染引擎技术打造，适用于智能终端的软件应用研发场景。</span></span></span></span></span></p>
<p> </p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">它的特点网站从框架特性，技术优势，应用场景几个方面展开。其中强调的</span></span><span lang="EN-US" style="background:white">AIoT</span><span style="background:white"><span style="font-family:"微软雅黑","sans-serif"">的应用，高性能几乎接近原生应用体验，跨平台等特点令人关注。</span></span></span></span></span></p>
<p> </p>
<p><span style="font-size:22pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">2、资料收集</span></span></span></span></p>
<p style="margin-left:13px; margin-bottom:13px"><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">1） 官方提供的语雀中包含了</span>Waft<span style="font-family:"微软雅黑","sans-serif"">快速开发指导，框架使用，组件文档，</span>API<span style="font-family:"微软雅黑","sans-serif"">手册等内容。</span></span></span></span> </p>
<p style="margin-left:13px; margin-bottom:13px"><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">2） 平头哥</span>OCC<span style="font-family:"微软雅黑","sans-serif"">社区</span> <a href="https://occ.t-head.cn/community/post" style="color:blue; text-decoration:underline">https://occ.t-head.cn/community/post</a> <span style="font-family:"微软雅黑","sans-serif"">，其中包含多篇博文教程，还有很多试用贴可供参考。</span></span></span></span> </p>
<p><span style="font-size:22pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">3、环境搭建</span></span></span></span></p>
<p> </p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">我这里使用</span>ubuntu 18.04 <span style="font-family:"微软雅黑","sans-serif"">版本作为开发平台。</span></span></span></span></p>
<p> </p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">首先再</span>windows<span style="font-family:"微软雅黑","sans-serif"">下安装虚拟机，安装</span>virtualBox<span style="font-family:"微软雅黑","sans-serif"">，开源的虚拟机软件，挺好用。在其中安装</span>ubuntu 18.04 64<span style="font-family:"微软雅黑","sans-serif"">位桌面版系统。</span></span></span></span></p>
<p> </p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">系统安装完成后就可以开始构建</span>waft<span style="font-family:"微软雅黑","sans-serif"">的开发环境了。这个过程主要参考语雀的快速开始教程完成，配合各种搜索引擎来解决这个过程的坑。</span></span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 1） 安装</span>node<span style="font-family:"微软雅黑","sans-serif"">环境</span></span></span></span></p>
<p> </p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">直接去</span><a href="https://nodejs.org/zh-cn/download/" style="color:blue; text-decoration:underline">https://nodejs.org/zh-cn/download/</a> <span style="font-family:"微软雅黑","sans-serif"">下载编译好的</span>Linux<span style="font-family:"微软雅黑","sans-serif"">的二进制包，然后解压到用户目录下，并添加全局路径。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">我感觉这样的好处是后面的安装过程基本不用使用</span>sudo<span style="font-family:"微软雅黑","sans-serif"">来强制。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif"">npm<span style="font-family:"微软雅黑","sans-serif"">软件安装的过程比较坎坷，无法获取到安装包是常有的事，所以有时候需要更换国内的一些镜像源，就快多了。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">可以采用命令</span> <span lang="EN-US" style="background:#f5f7ff">npm config set registry </span><a href="https://registry.npm.taobao.org" style="color:blue; text-decoration:underline"><span style="background:#f5f7ff"><span style="font-family:Consolas">https:</span></span><span style="font-family:Consolas">//registry.npm.taobao.org</span></a> <span style="background:#f5f7ff"><span style="font-family:"微软雅黑","sans-serif"">来更换源。</span></span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">也可以使用</span><span lang="EN-US" style="font-family:Consolas">cnpm</span><span style="font-family:"微软雅黑","sans-serif"">来安装一些必要的安装包。</span></span></span></span></p>
<p> 2） <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">安装</span>waft-cli<span style="font-family:"微软雅黑","sans-serif"">工具</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">安装好了</span>nodejs<span style="font-family:"微软雅黑","sans-serif"">环境后，接下来就是安装</span>waft-cli<span style="font-family:"微软雅黑","sans-serif"">这个称为脚手架的工具了。如果存在权限问题可以使用</span>sudo<span style="font-family:"微软雅黑","sans-serif"">，不过我没有遇到这个问题。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">命令为：</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> npm i waft-cli -g</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> <span style="font-family:"微软雅黑","sans-serif"">如果指令顺利执行完成的话，我们就可以开始基本</span>waft<span style="font-family:"微软雅黑","sans-serif"">的工程创建了。</span></span></span></span> </p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> 3） vscode</span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">这个工具用来编辑工程文件非常好，所以还要安装这个代码编辑器。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">可以通过</span>vscode<span style="font-family:"微软雅黑","sans-serif"">的官网下载安装包</span></span></span></span> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><a href="https://code.visualstudio.com/Download" style="color:blue; text-decoration:underline"><span style="background:#eef0f4"><span style="font-family:"Arial","sans-serif""><span style="color:#ca0c16">https://code.visualstudio.com/Download</span></span></span></a></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">也可以直接使用</span>ubuntu<span style="font-family:"微软雅黑","sans-serif"">的软件包管理软件搜索</span>vscode<span style="font-family:"微软雅黑","sans-serif"">安装，这个中方法比较简单，一键完成，推荐。</span></span></span></span></p>
<p> </p>
<p><span style="font-size:22pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">4、第一个例程测试</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">一切准备就绪，就是开始第一个程序测试了，安装语雀中快速开始的说明，我们一步一步执行下去就可以了。</span></span></span></span> </p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 1） 创建项目</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">首先我们新建一个目录，就命名为</span>waft_app<span style="font-family:"微软雅黑","sans-serif"">吧，进入目录后，运行</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif"">waft init</span></span></span></p>
<p></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">输入我们希望的用户名，比如</span>waft_test</span></span></span></p>
<p> </p>
<p></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 接下来就是选择模板了，按方向下键选择，我们选择</span>9) <span style="font-family:"微软雅黑","sans-serif"">平头哥天气</span>demo,<span style="font-family:"微软雅黑","sans-serif"">然后回车。</span></span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 接下来就是工程项目初始化过程，网络必须畅通，否则就够呛了。我们可以看到他在执行</span>npm install<span style="font-family:"微软雅黑","sans-serif"">的一个进度条。</span></span></span></span></p>
<p></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 当进度条走完了，出现</span>init done<span style="font-family:"微软雅黑","sans-serif"">的字样后，项目创建就完成了。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">2） 启动服务和项目预览</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">进入刚才创建的项目目录，</span> cd waft_test</span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">然后执行</span> npm run start</span></span></span></p>
<p> </p>
<p style="margin-bottom:13px"><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 命令执行后，可以看到终端的提示，我们来静态预览一下看看效果，再浏览器中打开</span></span></span></span></p>
<p></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif""> 再打开动态预览看看效果，结果什么都没有看到，屏幕是黑的，但是终端中出现了对当前项目的编译过程，目前还不知道产生的原因。</span></span></span></span></p>
<p> </p>
<p style="margin-bottom:13px"></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">3） 编译</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">输入命令：</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif"">waft>.build –aot=true –aotTarget=riscv64</span></span></span></p>
<p> </p>
<p style="margin-left:76px; margin-bottom:13px"><span style="font-size: 12pt; font-family: 微软雅黑, "sans-serif";">编译成功后，会出现</span><span style="font-family: Tahoma, "sans-serif"; font-size: 12pt;">Compile success</span><span style="font-size: 12pt; font-family: 微软雅黑, "sans-serif";">字样。同时我们可以察看工程文件的编译结果如下，存放在项目文件夹下的</span><span style="font-family: Tahoma, "sans-serif"; font-size: 12pt;">build</span><span style="font-size: 12pt; font-family: 微软雅黑, "sans-serif";">文件夹内。</span></p>
<p> </p>
<p style="margin-left:76px; margin-bottom:13px"></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">4） 开发套件配网</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">无线网络配置参数存放在</span>/etc/wifi<span style="font-family:"微软雅黑","sans-serif"">目录下，我们通过串口终端连接到开发套件，编辑</span>/etc/wifi/wpa_supplicant.conf<span style="font-family:"微软雅黑","sans-serif"">文件，输入实际的</span>wifi<span style="font-family:"微软雅黑","sans-serif"">的</span>ssid<span style="font-family:"微软雅黑","sans-serif"">和</span>psk<span style="font-family:"微软雅黑","sans-serif"">，保存文件后重启。</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">检查实际网络连接情况：执行</span> ifconfig</span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif"">root@MaixLinux:~# ifconfig </span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif"">wlan0 Link encap:Ethernet HWaddr 4C:21:1E:CF:C7:89 </span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> inet addr:192.168.95.2 Bcast:192.168.95.255 Mask:255.255.255.0</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> inet6 addr: fe80::4e21:1eff:fecf:c789/64 Scope:Link</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> UP BROADCAST RUNNING MULTICAST MTU:1500 Metric:1</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> RX packets:160 errors:0 dropped:0 overruns:0 frame:0</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> TX packets:204 errors:0 dropped:0 overruns:0 carrier:0</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> collisions:0 txqueuelen:1000 </span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> RX bytes:32889 (32.1 KiB) TX bytes:24151 (23.5 KiB)</span></span></span></p>
<p><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""> <span style="font-family:"微软雅黑","sans-serif"">已知</span>ip<span style="font-family:"微软雅黑","sans-serif"">地址为：</span>192.168.95.2</span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">5） 推送编译结果</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">这里采用</span>FTP<span style="font-family:"微软雅黑","sans-serif"">的方式完成结果推送，采用</span>ftp<span style="font-family:"微软雅黑","sans-serif"">软件将刚才编译的</span>app.wasm<span style="font-family:"微软雅黑","sans-serif"">上传到开发套件中。</span></span></span></span></p>
<p></p>
<p> </p>
<p style="margin-left:36px; margin-bottom:13px"><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">6） 实测</span></span></span></span></p>
<p> <span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">再串口终端中，执行刚刚上传的</span>app.wasm<span style="font-family:"微软雅黑","sans-serif"">文件。命令为：</span>waft_app app.wasm</span></span></span></p>
<p> </p>
<p style="margin-left:76px; margin-bottom:13px"><span style="font-size:12pt"><span style="150%"><span style="font-family:Tahoma,"sans-serif""><span style="font-family:"微软雅黑","sans-serif"">可见系统已经运行了，并且屏幕上出现了预设的组件信息。</span></span></span></span></p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p style="margin-left:76px; margin-bottom:13px"> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p style="margin-left:76px; margin-bottom:13px"> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p style="margin-left:76px; margin-bottom:13px"> </p>
<p> </p>
<p> </p>
页:
[1]