我之前也碰到过一模一样的困扰！用-g4编译确实是开启调试信息的关键一步，但还有几个容易忽略的配置和操作，帮你一步步排查：

• 确保编译命令包含源映射参数：
  如果用Emscripten编译，除了-g4，必须加上--source-map来生成Wasm到原代码的映射文件。完整命令大概是：

  emcc your_source.c -g4 --source-map -s DEMANGLE_SUPPORT=1 -o output.js
  

  其中-s DEMANGLE_SUPPORT=1还能帮你把混淆的Wasm函数名（比如$stackAlloc）还原成原C/C++函数名，调试体验会好很多。
  如果是直接用LLVM编译Wasm，要加上-fdebug-compilation-dir=/path/to/your/source，明确告诉编译器源代码的目录，这样Chrome才能正确定位源文件。

• 开启Chrome的Wasm调试支持：
  打开Chrome DevTools，点击右上角的齿轮图标进入设置，找到Experiments面板，确保勾选了WebAssembly Debugging: Enable DWARF support（新版本Chrome可能默认开启，但旧版本需要手动打开）。另外，在Sources面板里，记得关闭Show compiled code选项，这样DevTools会优先加载原代码而不是编译后的Wasm二进制。

• 映射源代码路径：
  有时候编译生成的源映射文件里记录的是编译机器上的绝对路径，和你本地调试的路径不匹配，Chrome找不到源文件。这时候可以在Sources面板里，右键点击那些wasm-0000~开头的文件，选择Add folder to workspace，把你的源代码目录添加进去，然后手动映射源映射里的路径到本地目录。

• 验证Wasm的调试信息：
  可以用wasm-objdump -g your_module.wasm命令检查Wasm文件里是否包含DWARF调试信息。如果输出里看不到原代码的文件名、行号和函数名，说明-g4参数没生效，建议升级你的Emscripten或LLVM到最新稳定版，旧版本可能对调试信息的支持有问题。

按照这些步骤操作后，应该就能在Chrome里直接调试你的原C/C++代码了！

内容的提问来源于stack exchange，提问作者N.hwang