Skip to content
| Marketplace
Sign in
Visual Studio Code>Programming Languages>Lens LSXNew to Visual Studio Code? Get it now.
Lens LSX

Lens LSX

Dentner

|
1 install
| (0) | Free
JSX-style editing, syntax highlighting, formatting and structural diagnostics for Lens LSX.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Lens LSX for VS Code

.lsx files open as Lens LSX, with JSX-style tag/attribute colors and C++ colors inside expressions. The extension supplies automatic indentation, bracket/quote pairs, folding, Format Document (Shift+Option+F on macOS), and format on save. Colors follow your existing theme.

Structural errors (mismatched/unclosed tags, duplicate attributes, malformed attribute values, unclosed expressions/literals) appear as squiggles and in Problems while typing. These checks do not require clang-format. C++ name/type diagnostics remain the build compiler's responsibility.

Install locally

From this directory, using Node 22 or newer:

npm ci
npm run package -- --out /tmp/lens-lsx.vsix
code --install-extension /tmp/lens-lsx.vsix

Reload VS Code after installation if an already-open LSX editor still shows Plain Text. No Marketplace publication is required. The VSIX bundles the LSX tools and works in Studio or any other project, without locating a Lens checkout.

Formatting requires Python 3 and clang-format on PATH. Configure executables explicitly if VS Code cannot find them:

{
    "lensLsx.pythonPath": "/opt/homebrew/bin/python3",
    "lensLsx.clangFormatPath": "/opt/homebrew/bin/clang-format",
    "lensLsx.columnLimit": 100,
    "[lsx]": {
        "editor.tabSize": 4,
        "editor.formatOnSave": true,
        "editor.defaultFormatter": "Dentner.lens-lsx"
    }
}

Defaults are four spaces, a soft 100-column limit and format on save for LSX only. User/workspace settings take precedence. Formatting uses the editor buffer, so unsaved content is included; it returns an undoable editor edit without writing a file directly. The formatter preserves text, comments and literal contents. In an untrusted workspace, syntax colors remain available while executable-based features stay disabled.

Development

npm ci
npm test
code --extensionDevelopmentPath="$PWD"

Grammar tests use VS Code's actual TextMate/Oniguruma tokenizer and the installed editor's built-in C++ grammar. Set VSCODE_CPP_SYNTAX_DIR to the directory containing cpp.tmLanguage.json when VS Code is installed in a nonstandard location. Provider tests run the real Python formatter/validator with an editor API fixture, including stale edits, cancellation and structural errors.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft