【Rust WebAssembly 入门实操遇到的问题】
Rust WebAssembly 入门实操遇到的问题
- 什么是WebAssembly
- 跟着教程走
- wasm-pack build error
- 总结
什么是WebAssembly
WebAssembly(简称Wasm)是一种基于堆栈的虚拟机的二进制指令
格式。Wasm 被设计为编程语言的可移植编译目标,支持在 Web 上部
署客户端和服务器应用程序。
简而言之,WebAssembly(wasm)是一种可以执行在堆栈虚拟机的二进制可执行指令集(所以在你编译后将看到后缀为wasm的二进制文件,这种文件可以运行在Wasm Runtime 上),一般的,市面上常见的浏览器均支持wasm Runtime。由此也可以看出,只要有Runtime在,wasm可以运行在任何结构的硬件上,这也为wasm在更多领域中发挥作用提供了可能。
跟着教程走
wasm tutorial 提供了完整的,从安装Rust环境到编译pkg,再到运行服务调用wasm的整个教程,初学者可以跟着教程走一遍有一个大概的感受。在学习教程的过程中会遇到一些问题,以下是我遇到的问题,作为个人整理和分享。
wasm-pack build error

根据教程上的步骤,执行
wasm-pack build
会自动生成pkg文件夹以及相关的文件,不过在这里我遇到了下面的问题:

报错显示我无法使用stable版本的rust使用示例工程中的attribute,难道我需要使用nightly版本吗?但是官方文档并没有要求这样做,回顾以下我们跟着文档都做过什么,发现cargo.toml中官方给到的wasm-bindgen 版本和我们真正使用到的版本不同,
官方是0.2.84,而我们使用的是0.2.97(当前最新),或许问题出在这里:
[dependencies]
wasm-bindgen = ">=0.2.87 , < 0.2.88"
如果我们像唯一确定一个版本使用,可以如上述写法,而默认的:
[dependencies]
wasm-bindgen = "0.2.84"
cargo的默认行为会拉取最大子集中最新的版本,因为wasm-bindgen目前还是0.xx.xx版本,非稳定版本,所以为了避免发生不必要的问题,尽量控制版本统一,好,控制完版本后重新运行:
wasm-pack build
发生了新的问题:
[INFO]: ⬇️ Installing wasm-bindgen...
我们的编译进程停止在这了,看到提示是正在安装wasm-bindgen,wasm-pack并没有正确获知我们已经安装了wasm-bindgen,同样的问题别人已经遇到过了,我们需要安装wasm-bindgen-cli :
cargo install wasm-bindgen-cli --version 0.2.87
需要保证的是,wasm-bindgen-cli与wasm-bindgen版本要一致,好的,我们继续编译,发现不会再停在安装wasm-bindgen上,而是又出现了新的问题:

生成的文件夹中没有package.json文件,没有这个文件,再后续的启动环节中,无法找到对应的wasm包,通过问题排查,发现需要手动在cargo.toml中添加:
[package.metadata.wasm-pack.profile.release]
wasm-opt = false
至此,问题就全部解决了,跟着教程启动服务后,访问服务器便可以看到alert弹窗了。
总结
官方文档通常是我们接触技术最直接最安全的文档,但是或许因为迭代之类的问题官方文档会忽略一些细节问题,这就需要开发者收集整理继而解决自己的问题。
相关文章:
【Rust WebAssembly 入门实操遇到的问题】
Rust WebAssembly 入门实操遇到的问题 什么是WebAssembly跟着教程走wasm-pack build error总结 什么是WebAssembly WebAssembly(简称Wasm)是一种基于堆栈的虚拟机的二进制指令 格式。Wasm 被设计为编程语言的可移植编译目标,支持在 Web 上部…...
掌握CMake中的变量:设置、使用及实际应用示例详解
掌握CMake中的变量:设置、使用及实际应用示例详解 在CMake中,变量的设置和使用是管理构建配置的核心部分,它使得项目配置更加灵活和动态。变量在CMake中用于保存各种数据,如路径、选项值或文件列表,可以在整个CMake配…...
React基础知识三 router路由全指南
现在最新版本是Router6和Router5有比较大的变化,Router5和Router4变化不大,本文以Router6的写法为主,也会对比和Router5的不同。比较全面。 安装路由 npm i react-router-dom基本使用 有两种Router,BrowserRouter和HashRouter&…...
[VUE]框架网页开发02-如何打包Vue.js框架网页并在服务器中通过Tomcat启动
在现代Web开发中,Vue.js已经成为前端开发的热门选择之一。然而,将Vue.js项目打包并部署到生产环境可能会让一些开发者感到困惑。本文将详细介绍如何将Vue.js项目打包,并通过Tomcat服务器启动运行。 1. 准备工作 确保你的项目能够正常运行,项…...
k8s Quality of Service
文章目录 QoS 分类规则QoS 类别影响创建 QoS 分类的案例1. Guaranteed QoS 示例示例 YAML 文件: 2. Burstable QoS 示例示例 YAML 文件: 3. BestEffort QoS 示例示例 YAML 文件: 4. 混合 QoS 示例(多个容器)示例 YAML …...
顶刊算法 | 鱼鹰算法OOA-BiTCN-BiGRU-Attention多输入单输出回归预测(Maltab)
顶刊算法 | 鱼鹰算法OOA-BiTCN-BiGRU-Attention多输入单输出回归预测(Maltab) 目录 顶刊算法 | 鱼鹰算法OOA-BiTCN-BiGRU-Attention多输入单输出回归预测(Maltab)效果一览基本介绍程序设计参考资料 效果一览 基本介绍 1.Matlab实…...
什么语言适合做 Serverless 开发?
随着云计算的普及,**无服务器架构(Serverless Architecture)**成为一种流行的开发模式,它使得开发者无需管理服务器基础设施,专注于编写应用逻辑。无服务器架构通常按需提供计算资源,能够灵活地扩展&#x…...
使用OpenCV和卡尔曼滤波器进行实时活体检测
引言 在现代计算机视觉应用中,实时检测和跟踪物体是一项重要的任务。本文将详细介绍如何使用OpenCV库和卡尔曼滤波器来实现一个实时的活体检测系统。该系统能够通过摄像头捕捉视频流,并使用YOLOv3模型来检测目标对象(例如人)&…...
【25春招前端八股文】——JS数据类型检测方式
检测数据类型 # typeof 总结:数组、对象、null都会被判断为object,其他判断都正确的类型。 可以检测基本数据类型null会检测为Object,因为null也是一个空的引用对象复杂数据类型只能检测function和Object 情况说明: 数组&#x…...
Kafka的学习路径规划
目录标题 1. 记(记忆力)Kafka核心概念Kafka关键配置 2. 懂(理解力)Kafka工作原理Kafka核心功能Kafka架构设计 3. 网(知识网络)技术栈整合用例和场景 4. 拓(全面拓展)学习材料多样化内…...
linux模拟试题
Linux 基础阶段考试笔试模拟试卷 审核人:王旺旺 一.填空题(每题 1 分,共 30 分) 1.验证 httpd 服务是否启动的命令是_______ 答:systemctl status httpd 或 netstat -anptl 或 ss -anpt 2.将目录 xxhf 下所有文件的所属组改为 user1 的命令是_______ 答:chown -R ,user1 …...
Qt-界面优化QSS
QSS介绍 先说下CSS: 在⽹⻚前端开发领域中, CSS 是⼀个⾄关重要的部分. 描述了⼀个⽹⻚的 "样式". 从⽽起到对⽹⻚美化的作⽤。 Qt 仿照 CSS 的模式, 引⼊了 QSS, 来对 Qt 中的控件做出样式上的设定 。 CSS的功能很强大,QSS要逊色一些&#…...
QT实战-qt各种菜单样式实现
本文主要介绍了qt普通菜单样式、带选中样式、带子菜单样式、超过一屏幕菜单样式、自定义带有滚动条的菜单样式, 先上图如下: 1.普通菜单样式 代码: m_pmenu new QMenu(this);m_pmenu->setObjectName("quoteListMenu"); qss文…...
深度学习基础03_BP算法(下)过拟合和欠拟合
目录 一、BP算法(下) 0、反向传播代码回顾 写法一: 写法二(更常用): 1、BP中的梯度下降 1.数学描述 2.传统下降方式 3.优化梯度下降方式 指数加权平均 Momentum AdaGrad RMSProp Adam(常用) 总结 二、过拟合和欠拟合 1、概念 1.过拟合 …...
web vue 滑动选择 n宫格选中 九宫格选中
页面动态布局经常性要交给客户来操作,他们按时他们的习惯在同一个屏幕内显示若干个子视图,尤其是在医学影像领域对于影像的同屏显示目视对比显的更为重要。 来看看如下的用户体验: 设计为最多支持5行6列页面展示后,右侧的布局则动…...
Spring Boot整合EasyExcel
Spring Boot整合EasyExcel主要涉及到以下几个步骤: 1.添加EasyExcel依赖到Spring Boot项目的pom.xml文件中。 2.创建数据模型类,用于映射Excel文件中的数据。 3.编写读取和写入Excel的服务。 以下是一个简单的例子: 1.添加EasyExcel依赖 …...
微软表示不会使用你的 Word、Excel 数据进行 AI 训练
微软否认使用 Microsoft 365 应用程序(包括 Word、Excel 和 PowerPoint)收集数据来训练公司人工智能 (AI) 模型的说法。 此前,Tumblr 的一篇博文声称,雷德蒙德使用“互联体验”功能抓取客户的 Word 和 Excel 数据,用…...
JavaScript(一)
1.JavaScript 基本使用 2.JavaScript简单事件 3.JavaScript修改样式 4.JavaScript数据类型 JavaScript和Java有什么关系 知识点一 JavaScript基本使用 JS写在哪 还有一种写在中间的,也就是<head>里面 JS一些注意事项 JS修改元素内容 #JS获取对象<…...
Day 32 动态规划part01
今天正式开始动态规划! 理论基础 无论大家之前对动态规划学到什么程度,一定要先看 我讲的 动态规划理论基础。 如果没做过动态规划的题目,看我讲的理论基础,会有感觉 是不是简单题想复杂了? 其实并没有,我讲的理论基础内容,在动规章节所有题目都有运用,所以很重要!…...
winform跨线程更新界面
前言: 大家好,我是上位机马工,硕士毕业4年年入40万,目前在一家自动化公司担任软件经理,从事C#上位机软件开发8年以上!我们在开发C#程序的时候,有时候需要在非Ui主线程更新界面,为了…...
MySQL 8.0 OCP 英文题库解析(十三)
Oracle 为庆祝 MySQL 30 周年,截止到 2025.07.31 之前。所有人均可以免费考取原价245美元的MySQL OCP 认证。 从今天开始,将英文题库免费公布出来,并进行解析,帮助大家在一个月之内轻松通过OCP认证。 本期公布试题111~120 试题1…...
Unit 1 深度强化学习简介
Deep RL Course ——Unit 1 Introduction 从理论和实践层面深入学习深度强化学习。学会使用知名的深度强化学习库,例如 Stable Baselines3、RL Baselines3 Zoo、Sample Factory 和 CleanRL。在独特的环境中训练智能体,比如 SnowballFight、Huggy the Do…...
Python 包管理器 uv 介绍
Python 包管理器 uv 全面介绍 uv 是由 Astral(热门工具 Ruff 的开发者)推出的下一代高性能 Python 包管理器和构建工具,用 Rust 编写。它旨在解决传统工具(如 pip、virtualenv、pip-tools)的性能瓶颈,同时…...
react菜单,动态绑定点击事件,菜单分离出去单独的js文件,Ant框架
1、菜单文件treeTop.js // 顶部菜单 import { AppstoreOutlined, SettingOutlined } from ant-design/icons; // 定义菜单项数据 const treeTop [{label: Docker管理,key: 1,icon: <AppstoreOutlined />,url:"/docker/index"},{label: 权限管理,key: 2,icon:…...
Qwen系列之Qwen3解读:最强开源模型的细节拆解
文章目录 1.1分钟快览2.模型架构2.1.Dense模型2.2.MoE模型 3.预训练阶段3.1.数据3.2.训练3.3.评估 4.后训练阶段S1: 长链思维冷启动S2: 推理强化学习S3: 思考模式融合S4: 通用强化学习 5.全家桶中的小模型训练评估评估数据集评估细节评估效果弱智评估和民间Arena 分析展望 如果…...
Selenium 查找页面元素的方式
Selenium 查找页面元素的方式 Selenium 提供了多种方法来查找网页中的元素,以下是主要的定位方式: 基本定位方式 通过ID定位 driver.find_element(By.ID, "element_id")通过Name定位 driver.find_element(By.NAME, "element_name"…...
生信服务器 | 做生信为什么推荐使用Linux服务器?
原文链接:生信服务器 | 做生信为什么推荐使用Linux服务器? 一、 做生信为什么推荐使用服务器? 大家好,我是小杜。在做生信分析的同学,或是将接触学习生信分析的同学,<font style"color:rgb(53, 1…...
Excel 怎么让透视表以正常Excel表格形式显示
目录 1、创建数据透视表 2、设计 》报表布局 》以表格形式显示 3、设计 》分类汇总 》不显示分类汇总 1、创建数据透视表 2、设计 》报表布局 》以表格形式显示 3、设计 》分类汇总 》不显示分类汇总...
民锋视角下的资金流效率与账户行为建模
民锋视角下的资金流效率与账户行为建模 在当前复杂多变的金融环境中,资金流效率已成为衡量一家金融服务机构专业能力的重要指标。民锋在账户管理与资金调配的实战经验中,逐步建立起一套以资金流路径为核心的行为建模方法,用以评估客户行为、交…...
Android Camera Hal中通过Neon指令优化数据拷贝
背景描述: Camera apk普通相机模式录像操作时,一般是同时请求两个流,即预览流和录像流。对于两个流输出图像格式和分辨率相同的情况下,是不是可以通过一个流拷贝得到另一个流的数据,进而节省掉一个Sensor输出处理两次…...
