Skip to content
| Marketplace
Sign in
Visual Studio Code>Other>Axaml OutlineNew to Visual Studio Code? Get it now.
Axaml Outline

Axaml Outline

全卓

|
2 installs
| (0) | Free
Provide Outline feature for axaml file in VSCode
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

AXAML Outline

Lightweight VS Code extension that provides Outline symbols for Avalonia AXAML files.

Features

  • Outline tree for .axaml files
  • Nested symbol structure based on AXAML element hierarchy
  • Symbol labels prefer x:Name or Name when available
  • Works with incomplete documents during editing (best-effort parsing)

How It Works

The extension registers a DocumentSymbolProvider for AXAML files and builds DocumentSymbol nodes from AXAML tags. These symbols are consumed by:

  • Outline view
  • Breadcrumbs
  • Go to Symbol in Editor (@)

Requirements

  • VS Code 1.85.0 or newer

Usage

  1. Open any .axaml file.
  2. Open the Outline view in the Explorer panel.
  3. Navigate UI elements through the generated symbol tree.

Development

Install dependencies:

npm install

Run build checks:

npm run check-types
npm run lint

Watch mode during development:

npm run watch

Package extension:

vsce package

Limitations

  • Current implementation focuses on Outline symbols only.
  • It does not provide full language features such as rename, references, or diagnostics.

License

MIT. See LICENSE.

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2026 Microsoft