0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Windows11 の VSCode+Emscripten で wasm によるハローワールド (17)

Last updated at Posted at 2025-10-17

すべての記事

Node.js で実行

予め Emscripten に付属の Node.js にもパスを通している ため、VSCode 環境で特別なことをしなくとも launch.json さえ準備すればコンソールでの実行ができるようになっている。

JavaScript のコードも Node.js だからといってブラウザのものと変わることもない。
以下は Node.js でデバッグしたときのファイル一覧となる。

C:\wasm\project\14-nodejs\.vscode\launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Node Debug",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}\\main.mjs"
        }
    ]
}

C:\wasm\project\14-nodejs\CMakePresets.json

{
  "version": 5,
  "cmakeMinimumRequired": {
    "major": 3,
    "minor": 20,
    "patch": 0
  },
  "configurePresets": [
    {
      "name": "wasm-config",
      "hidden": true,
      "generator": "Ninja Multi-Config",
      "binaryDir": "${sourceDir}/build",
      "cacheVariables": {
        "CMAKE_CXX_STANDARD": "17",
        "CMAKE_CXX_STANDARD_REQUIRED": "ON",
        "CMAKE_CXX_EXTENSIONS": "OFF",
        "CMAKE_TOOLCHAIN_FILE": "$env{EMSDK}/upstream/emscripten/cmake/Modules/Platform/Emscripten.cmake",
        "CMAKE_EXPORT_COMPILE_COMMANDS": "ON",
        "CMAKE_CONFIGURATION_TYPES": "Debug;Release"
      }
    },
    {
      "name": "wasm-config-debug",
      "inherits": "wasm-config",
      "cacheVariables": {
      }
    },
    {
      "name": "wasm-config-release",
      "inherits": "wasm-config",
      "cacheVariables": {
      }
    }
  ],
  "buildPresets": [
    {
      "name": "wasm-build-debug",
      "configurePreset": "wasm-config-debug",
      "verbose": true,
      "configuration": "Debug"
    },
    {
      "name": "wasm-build-release",
      "configurePreset": "wasm-config-release",
      "verbose": true,
      "configuration": "Release"
    }
  ]
}

C:\wasm\project\14-nodejs\CMakeLists.txt

cmake_minimum_required(VERSION 3.20)
project(14_nodejs LANGUAGES CXX)

add_executable(14_nodejs main.cpp)
target_link_options(14_nodejs PRIVATE
    $<$<CONFIG:Debug>:-gsource-map -sASSERTIONS=1 -sSAFE_HEAP=1>
    "-sEXPORT_ES6"
)

C:\wasm\project\14-nodejs\main.mjs

import Module from './build/Debug/14_nodejs.js';

const emsModule = await Module({ arguments: ['nodejs'] });

let v = 0;
v = emsModule._increment(v);
console.log(`return=${v}`);

C:\wasm\project\14-nodejs\main.cpp

// UTF-8N CRLF
#include <emscripten.h>
#include <iostream>
#include <fstream>

extern "C"
EMSCRIPTEN_KEEPALIVE
int increment(int v)
{
	printf("-- increment(%d)\n", v);
	return v + 1;
}

int main(int argc, char** argv, char** envp)
{
	std::cout << "C++ main(argc=" << argc << ", argv=[";

	for (int i=0; i<argc; ++i)
	{
		if (i) {
			std::cout << ",";
		}
		std::cout << "'" << argv[i] << "'";
	}

	std::cout << "])" << std::endl;


	return 0;
}

// EOF

デバッガの起動

これもブラウザでのデバッグと変わらない。
JavaScript と C++ にブレークポイントを設置してデバッグを開始する。

image.png

C++ ソースでのブレーク

image.png

JavaScript でのブレーク

image.png

実行結果

C:\wasm\tool\emsdk-4.0.16\node\22.16.0_64bit\bin\node.exe --experimental-network-inspection .\main.mjs
C++ main(argc=2, argv=['C:/wasm/project/14-nodejs/main.mjs','nodejs'])
-- increment(0)
return=1
0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?