https://github.com/guyutongxue/clangd-in-browser

Port clangd language server to WASM, and run it in your browser.
https://github.com/guyutongxue/clangd-in-browser

clang clangd cpp llvm lsp monaco-editor wasm

Last synced: 3 days ago
JSON representation

Port clangd language server to WASM, and run it in your browser.

• Host: GitHub
• URL: https://github.com/guyutongxue/clangd-in-browser
• Owner: guyutongxue
• License: mit
• Created: 2024-01-28T14:28:01.000Z (8 months ago)
• Default Branch: main
• Last Pushed: 2024-05-18T03:28:23.000Z (5 months ago)
• Last Synced: 2024-09-25T16:05:54.451Z (8 days ago)
• Topics: clang, clangd, cpp, llvm, lsp, monaco-editor, wasm
• Language: TypeScript
• Homepage: https://clangd.guyutongxue.site/
• Size: 156 KB
• Stars: 34
• Watchers: 1
• Forks: 5
• Open Issues: 2
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# [Clangd](https://clangd.llvm.org) in Browser

Finally, I made clangd work in browser. You can now get C++ IntelliSense directly without installing any native compiler or relying on a remote server.

This repo contains a build script for clangd on WebAssembly (TBD), and an example of using clangd WASM module together with [Monaco Editor](https://microsoft.github.io/monaco-editor) powered by it's Language Client port (thanks [TypeFox/monaco-languageclient](https://github.com/TypeFox/monaco-languageclient)).

## How to build

You can take a look at `build.sh` for how to build clangd to WASM. Once `clangd.wasm` generated at `public/wasm`, you can build those frontend code using `pnpm install` and `pnpm build`.

## About the example page

I've publish a [GitHub Page](https://clangd.guyutongxue.site/) for demonstrating how clangd works in your browser.

Notice that clangd is a multi-thread program, so we need `SharedArrayBuffer` -- and more over, a strict context called `crossOriginIsolated`. GitHub Pages do not send COOP/COEP headers for us to enabling that context, so I served this site through CloudFlare with a custom rule adding those headers. If you want to deploy this project by yourself, make sure correct COOP/COEP header is set on the server side, or you can use  [`coi-serviceworker`](https://github.com/gzuidhof/coi-serviceworker).

You can pass URL search parameters to control the initial state of this page ([see here](./docs/params.md)), or embed it in your website ([see here](./docs/embed.md), **your website needs to be cross-origin-isolated too**)

## Acknowledgement

- [soedirgo/llvm-wasm](https://github.com/soedirgo/llvm-wasm) provides a very detailed guide on how to build LLVM to wasm. Better than famous works like [binji/wasm-clang](https://github.com/binji/wasm-clang) or [tbfleming/cib](https://github.com/tbfleming/cib) (but also thank you guys :P);

- [nokotan/vscode-clangd](https://github.com/nokotan/vscode-clangd) patch vscode's clangd extension with WASM binary to make it work on vscode-web. Some bugs but useful; no build scripts or further documentation;

- [ConorBobbleHat/clangd-wasm](https://github.com/ConorBobbleHat/clangd-wasm) and [ConorBobbleHat/clangd-wasm-core](https://github.com/ConorBobbleHat/clangd-wasm-core); build scripts provided but lack examples on how to use them.