WRNexus Language Support

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

Installation

After the first Marketplace release, search for WRNexus Language Support in VS Code or run:

ext install wrnexus.wrnexus

For a local package, open the Command Palette, choose Extensions: Install from VSIX, and select the generated wrnexus-<version>.vsix file.

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.
Formatting. Format Document and format-on-save normalize WRN block, HTML, CSS, and function indentation without rewriting application expressions.
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.

Settings

Setting	Default	Description
`wrnexus.diagnostics.enable`	`true`	Show parse errors for `.wrn` files.
`wrnexus.format.enable`	`true`	Enable the built-in formatter for `.wrn`.

To format automatically when saving, add this to VS Code settings:

"[wrn]": {
  "editor.defaultFormatter": "wrnexus.wrnexus",
  "editor.formatOnSave": true
}

Privacy

The extension does not collect telemetry and does not send source code or usage data over the network. Formatting, completion, and diagnostics run locally.

Development

Diagnostics use a bundled copy of the compiler. Build and validate everything after changing the extension or @wrnexus/compiler:

bun install
bun run check
bun run package

bun run package creates wrnexus-<version>.vsix. The extension still highlights, provides snippets, and completes without the compiler 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.

See the Marketplace publishing guide for the release procedure.

3.3 KiB Raw Blame History