Editor & LSP

Reepolee ships a Language Server Protocol server at ree-lsp.cjs that gives any LSP-compatible editor deep awareness of your .ree templates. It runs as a stdio process — no network port, no daemon, no separate install. The project starter already includes it and configures it through the ree section in package.json.

What It Provides

How It Works

The LSP reads the ree section from package.json to discover your project's structure:

{
  "ree": {
    "project_family": "reepolee",
    "template_roots": ["routes"],
    "component_roots": ["components"],
    "translation_provider": "db-export",
    "translation_root": ".reepolee/i18n"
  }
}

From these paths it builds a project profile that knows:

• Where templates live — routes/ and any additional template_roots
• Where components live — components/ and any additional component_roots
• Where translations live — .reepolee/i18n/, the JSON export that the dev server writes at startup. The LSP reads these files for autocompletion of {_ } / {- } / {@ } keys and shows the resolved value in every locale on hover

The translation_provider: "db-export" tells the LSP that translations are database-backed and exported to JSON — it reads the export rather than connecting to the database. Run bun dev at least once so the export files exist for the LSP to consume.

Connecting Your Editor

VS Code

Install the Ree Templates extension from the marketplace. It bundles the LSP and connects automatically when you open a .ree file in a project with a ree section in package.json.

code --install-extension reepolee.ree-templates

The extension also provides syntax highlighting, file icons, and formatting (via reettier). See the extension docs for settings and configuration.

For Tailwind IntelliSense inside .ree files, add to your VS Code settings:

"tailwindCSS.includeLanguages": { "ree": "html" }

Other Editors

Any editor that speaks LSP over stdio can connect. Point it at:

bun ree-lsp.cjs

from the project root. The server uses JSON-RPC 2.0 over stdin/stdout. It accepts initialize, textDocument/completion, textDocument/hover, textDocument/definition, and textDocument/didChange / didOpen / didClose. Consult your editor's LSP documentation for how to register a custom stdio language server.

Translation Support

The LSP reads translation indexes from .reepolee/i18n/ (written by the dev server at startup and on translation reload). This gives you:

• Key completions — type {_ and see every key from your translation namespace with its English value as a detail string
• Multi-locale hover — hover any {_ ui.title } to see its value in every configured locale
• Go-to-definition — Cmd/Ctrl-click a key to jump to its entry in the locale JSON file

If completions don't appear, start bun dev once so the export files are generated. The LSP re-reads them when they change.

Without the ree Section

If package.json has no ree object, the LSP falls back to heuristics: it walks up the directory tree looking for routes/ alongside lib/template/compiler.ts. When it finds both it loads a default Reepolee profile. The explicit ree section is faster and unambiguous — every starter ships with it.

Troubleshooting