我怎样才能在chrome上调试wasm？

Question

我想在chrome上调试wasm代码。

我使用'-g4'选项检查了指南构建。 我做了它，它显示了wasm-0000~和下面的二进制代码...

  func $stackAlloc (param i32) (result i32)
  (local i32)
   get_global 7
   ....

是否需要更多选择或我做错了什么？

提前致谢！

Answer 1

你没有做错任何事，ism实际上是二进制格式，你的浏览器显示了wasm二进制格式的文本表示。 See more at mozilla这是最好的浏览器可以做的，你可以设置断点左右，好像它是浏览器开发者工具中的javascirpt。

然而，使用原始语言c / c ++ / rust进行调试更容易...确保首先工作然后将其编译为wasm。

Answer 2

在Chrome 70中似乎仍然无法实现。不过，从Firefox 60开始，在保留调试信息并启用了源映射的情况下，您可以遍历源代码。

使用保留的调试信息和基本URL上的源映射信息进行编译：

emcc -g4 --source-map-base http://host:port/base-path-to-source-maps-and-sources/ ...

现在将源文件以及生成的.wasm.map复制到--source-map-base选项所指向的目标目录。您现在也将能够调试源代码。

目录布局：

$ tree # in the served directory
.
├── hellowasm.c
├── hellowasm.js
├── hellowasm.wasm
├── hellowasm.wasm.map
├── hellowasm.wast
├── index.html
└── main.js

Voilà！

您可以在此处找到详细信息：http://webassemblycode.com/using-browsers-debug-webassembly/

Answer 3

对于2020年遇到此问题的人：现在可以通过使用emcc -g（相当于emcc -g3）编译代码来在Chrome DevTools中调试WebAssembly。

更多信息可在官方公告中找到：https://developers.google.com/web/updates/2020/12/webassembly