{"id":13520457,"url":"https://github.com/TheLartians/modern-wasm-starter","last_synced_at":"2025-03-31T16:31:27.911Z","repository":{"id":42843930,"uuid":"263031905","full_name":"TheLartians/modern-wasm-starter","owner":"TheLartians","description":"🛸 Run C++ code on web and create blazingly fast websites! A starter template to easily create WebAssembly packages using type-safe C++ bindings with automatic TypeScript declarations.","archived":false,"fork":false,"pushed_at":"2023-01-07T04:41:50.000Z","size":250,"stargazers_count":249,"open_issues_count":2,"forks_count":13,"subscribers_count":9,"default_branch":"master","last_synced_at":"2025-03-31T16:16:29.440Z","etag":null,"topics":["asmjs","c-plus-plus","cmake","cpp","declarations","embind","emscripten","glue","javascript","modern","npm","package","starter","tests","typesafe","typescript","wasm","webassembly","webpack"],"latest_commit_sha":null,"homepage":"https://runkit.com/embed/wdcjombu4wnt","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"unlicense","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TheLartians.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2020-05-11T12:10:26.000Z","updated_at":"2025-03-29T14:51:57.000Z","dependencies_parsed_at":"2023-02-06T12:01:28.203Z","dependency_job_id":null,"html_url":"https://github.com/TheLartians/modern-wasm-starter","commit_stats":null,"previous_names":[],"tags_count":26,"template":true,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TheLartians%2Fmodern-wasm-starter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TheLartians%2Fmodern-wasm-starter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TheLartians%2Fmodern-wasm-starter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TheLartians%2Fmodern-wasm-starter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TheLartians","download_url":"https://codeload.github.com/TheLartians/modern-wasm-starter/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246497937,"owners_count":20787230,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["asmjs","c-plus-plus","cmake","cpp","declarations","embind","emscripten","glue","javascript","modern","npm","package","starter","tests","typesafe","typescript","wasm","webassembly","webpack"],"created_at":"2024-08-01T05:02:21.262Z","updated_at":"2025-03-31T16:31:27.892Z","avatar_url":"https://github.com/TheLartians.png","language":"TypeScript","funding_links":[],"categories":["TypeScript"],"sub_categories":[],"readme":"![Check](https://github.com/TheLartians/modern-wasm-starter/workflows/Check/badge.svg)\n[![npm version](https://badge.fury.io/js/modern-wasm-starter.svg)](https://badge.fury.io/js/modern-wasm-starter)\n\n# Modern WASM Starter\n\nA starter template to easily create WebAssembly packages for npm using type-safe C++ code with automatic declarations.\nThis project should take care of most of the boilerplate code required to create a modern and type-safe WebAssembly project.\n\n## Features\n\n- Integrated node.js packaging and dependency management through [npm](https://www.npmjs.com)\n- Type safety through [TypeScript](https://www.typescriptlang.org)\n- [CMake](https://cmake.org) build system\n- Integrated C++ dependency management using [CPM.cmake](https://github.com/TheLartians/CPM.cmake) \n- Automatic bindings and typescript declarations using the [Glue](https://github.com/TheLartians/Glue) library\n- Integrated test suite using [jest](https://jestjs.io)\n- Code formatting enforced through [prettier](https://prettier.io) and [Format.cmake](https://github.com/TheLartians/Format.cmake)\n- Semi-automatic memory management using [scopes](#memory-management)\n- A [GitHub action](.github/workflows/publish.yml) to automatically [update the npm release](https://github.com/mikeal/merge-release) for each commit to master\n\n## Usage\n\n### Get started\n\nUse this repo [as a template](https://github.com/TheLartians/modern-wasm-starter/generate) to quickly start your own projects!\n\n### Build WebAssembly code\n\nTo be able to build WebAssembly code from C++ using Emscripten, you must first [install and activate the emsdk](https://emscripten.org/docs/getting_started/downloads.html).\nTo compile the C++ code to WebAssembly, run the following command from the project's root directory.\n\n```bash\nnpm install\n```\n\nThis will create the files `source/WasmModule.js` and `source/WasmModule.d.ts` from the C++ code in the [wasm](wasm) directory and transpile everything into a JavaScript module in the `dist` directory.\nTo build your code as wasm, add it as a CPM.cmake dependency in the [CMakeLists.txt](wasm/CMakeLists.txt) file and define the bindings in the [wasmGlue.cpp](wasm/source/wasmGlue.cpp) source file.\nTo update the wasm and TypeScript declarations, you can run `npm run build:wasm`. \n\n### Run tests\n\nThe following command will build and run the test suite.\n\n```bash\nnpm test\n```\n\nFor rapid developing, tests can also be started in watch mode, which will automatically run on any code change to the TypeScript or JavaScript sources.\n\n```bash\nnpm start\n```\n\n### Fix code style\n\nThe following command will run prettier on the TypeScript and clang-format on the C++ source code.\n\n```\nnpm run fix:style\n```\n\n## Writing bindings\n\nThis starter uses the Glue project to create bindings and declarations.\nUpdate the [wasmGlue.cpp](wasm/source/wasmGlue.cpp) source files to expose new classes or functions.\nSee the [Glue](https://github.com/TheLartians/Glue) or [EmGlue](https://github.com/TheLartians/EmGlue) projects for documentation and examples.\n\n## Memory management\n\nAs JavaScript has no destructors, any created C++ objects must be deleted manually, or they will be leaked.\nTo simplify this, the project introduces memory scopes that semi-automatically take care of memory management.\nThe usage is illustrated below.\n\n```ts\nimport { withGreeter } from \"modern-wasm-starter\";\n\n// `withGreeter()` will run the callback asynchronously in a memory scope and return the result in a `Promise`\nwithGreeter(greeterModule =\u003e {\n  // construct a new C++ `Greeter` instance\n  const greeter = new greeterModule.Greeter(\"Wasm\");\n\n  // call a member function\n  console.log(greeter.greet(greeterModule.LanguageCode.EN));\n  \n  // any created C++ objects will be destroyed after the function exits, unless they are persisted\n});\n```\n\nTo see additional techniques, such as synchronous scopes or persisting and removing values outside of the scope, check out the [tests](__tests__/wasm.ts) or [API](source/wasmWrapper.ts).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTheLartians%2Fmodern-wasm-starter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FTheLartians%2Fmodern-wasm-starter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FTheLartians%2Fmodern-wasm-starter/lists"}