如何在VS Code中调试WASM项目中的原生C++代码？

1. 确认Emscripten编译参数正确性 #

编译时必须添加以下参数，确保生成完整的调试信息与源映射：

• -g：生成DWARF格式的调试数据（核心必填项）
• -gsource-map：生成WASM到C++源码的映射文件
• --source-map-base <本地路径>：指定C++源码的基础路径，比如源码在项目src/目录下就设为./src/
• 禁用所有-O开头的优化参数（优化会破坏调试信息关联性）

示例编译命令：

emcc src/your_cpp_code.cpp -o build/wasm_wrapper.js -g -gsource-map --source-map-base ./src/

2. 调整VS Code调试配置（launch.json） #

修改原有Node.js启动配置，添加WASM调试支持参数，并确保启用源映射：

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch ANTLR4 test",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "runtimeArgs": [
                "--no-warnings=ExperimentalWarning",
                "--experimental-wasm-debugging", // 开启Node.js的WASM调试能力
                "--loader",
                "ts-node/esm",
                "tests/test.ts"
            ],
            "sourceMaps": true,
            "cwd": "${workspaceFolder}"
        }
    ]
}

若上述配置无效，可尝试用Chrome附加调试Node进程：

1. 先启动Node进程并开启调试端口：

node --inspect --no-warnings=ExperimentalWarning --loader ts-node/esm tests/test.ts

2. 在launch.json中添加附加配置：

{
    "type": "chrome",
    "request": "attach",
    "name": "Attach to Node.js",
    "port": 9229,
    "webRoot": "${workspaceFolder}",
    "sourceMaps": true
}

3. 配置C/C++扩展识别源码 #

新建或修改.vscode/c_cpp_properties.json，让VS Code找到C++源码并提供语法支持：

{
    "configurations": [
        {
            "name": "WASM",
            "includePath": [
                "${workspaceFolder}/src/**"
            ],
            "compilerPath": "emcc", // 替换为你的Emscripten编译器实际路径
            "cStandard": "c17",
            "cppStandard": "c++17",
            "intelliSenseMode": "emscripten-wasm32"
        }
    ],
    "version": 4
}

4. 启动调试 #

直接在C源码中设置断点，启动调试配置即可。程序运行到WASM中的C逻辑时，断点会触发，可像调试原生C++一样查看变量、调用栈。

注意事项：

• 确保Node.js版本在16.x及以上（旧版本WASM调试支持不完善）
• 检查生成的.wasm.map文件，确认其中的源码路径指向本地正确位置

内容的提问来源于stack exchange，提问作者Mike Lischke