WrNexus for VS Code

Language support for WrNexus .wrn files — the SSR-first, Bun-powered full-stack framework.

Features

Syntax highlighting ("color-full code"). Keywords (page, component, state, view, api, realtime, …) plus embedded highlighting for the languages inside each block:
- view { … } → HTML, with {expr} interpolation and {t:key} translations and @event="…" bindings picked out.
- style { … } → CSS.
- functions { … }, api … { … }, ssr/client, realtime on(…) { … } → TypeScript.
WrNexus attributes in distinct colors. A grammar injection recolors the framework's own attributes so they pop even inside plain HTML: @event bindings and {t:…} in one accent, runtime directives (data-component, data-for, data-show, data-text, data-scope, data-slot, data-on-*, data-wire-*) in another. Default colors ship with the extension; change them under editor.tokenColorCustomizations (scopes entity.other.attribute-name.wrn.directive and …wire.event).
Diagnostics. Parse errors from the real @wrnexus/compiler are shown inline as you type, anchored to the exact offset.
Snippets. page, component, view, state, props, seo, api, ssr, client, realtime, functions, style, plus view helpers mount, for, show, t.
Completions. Block keywords at file scope, data-* runtime attributes and @event bindings inside a view, and HTTP methods after api.

Setting	Default	Description
`wrnexus.diagnostics.enable`	`true`	Show parse errors for `.wrn` files.

Diagnostics use a bundled copy of the compiler. Regenerate it after changing @wrnexus/compiler:

bun run build:compiler   # writes src/compiler.cjs

The extension still highlights, snippets and completes without the bundle; only inline error reporting requires it.

Open this folder in VS Code and press F5 to launch an Extension Development Host, then open any .wrn file.