HTML Mustache Language Server
A VS Code language server for HTML with Mustache template syntax, powered by tree-sitter. It provides semantic highlighting, document symbols, hover information, and folding ranges for .mustache, .hbs, and .handlebars files.
Build and Run
Run these commands from the repository root:
pnpm install
pnpm build # Compile the grammar to WebAssembly
pnpm --dir lsp run build # Bundle the extension and copy its WASM assets
Then launch the extension in VS Code:
- Open the
lsp/ folder in VS Code.
- In Run and Debug, select Launch LSP Extension and press F5.
- In the Extension Development Host window, open test-files/test.mustache or another template file.
- Check syntax highlighting, the document outline, hover information, and folding.
Development
Run the following commands from the repository root:
| Task |
Command |
| Rebuild the extension |
pnpm --dir lsp run build |
| Run server tests |
pnpm --dir lsp test |
| Watch server tests |
pnpm --dir lsp run test:watch |
| Check TypeScript types |
pnpm --dir lsp run typecheck |
| Lint client and server code |
pnpm --dir lsp run lint |
| Create a production build |
pnpm --dir lsp run build:production |
After changing extension code, rebuild and restart the debugging session. The launch configuration also runs the extension build before starting.
After changing grammar.js, regenerate the parser before rebuilding the WASM and extension:
pnpm exec tree-sitter generate
pnpm build
pnpm --dir lsp run build
Troubleshooting
Missing WASM files
Repeat both build commands in Build and Run. The root build creates tree-sitter-htmlmustache.wasm; the extension build copies it into lsp/ and copies dependency WASM files into lsp/server/out/.
No highlighting or language features
- Check the HTML Mustache channel in VS Code's Output panel for startup errors.
- Confirm the file uses a supported extension and the HTML Mustache language mode.
- For semantic highlighting, make sure it is enabled in VS Code settings.
Code Layout
The server parses documents when they open or change, caches their syntax trees, and uses those trees to implement language features. To add a feature, implement it in server/src/, register its handler and capability in server.ts, and add a test in server/test/.