Hypra for VS Code
Support for Hypra, the markup language that compiles to HTML for people and to Markdown and JSON for AI agents. Works in VS Code, Cursor and other editors built on VS Code.
- Highlighting for
.hyprafiles, including the JavaScript, CSS and JSON insidescriptandstyle. - Errors and warnings as you type, with the rule code, how to fix it, and a link to where the docs explain it. Files you import are checked too, as you edit them.
- Go to Definition (Ctrl+click or F12) on components, layouts,
usepaths, props and loop variables, also in imported files. Ctrl+click on a definition lists where it's used. - Find All References (Shift+F12) and Rename (F2), across every
.hyprafile in the folder: renaming a component also renames its calls, and renaming a parameter renames the arguments that set it. - Hover over a name to see where it's defined, or over an element or field type to see what it does, with an example.
- Format Document, the same as
hypra fmt.
Install
In Cursor, VSCodium and other editors that install from Open VSX,
search for "Hypra" in the Extensions view. In VS Code, download hypra-<version>.vsix from the
latest release, then in the Extensions view choose
… → Install from VSIX….
Settings
Everything except highlighting comes from hypra lsp, the language server in the hypra compiler. Put the
compiler on your PATH, or set hypra.path to where it is.
| Setting | Default | |
|---|---|---|
hypra.path |
hypra |
the compiler: a command on your PATH or a full path |