Skip to content

Add Astro (.astro) lexer #1293

Description

@Xeonzilla

Is there an existing issue for this?

  • I have searched the existing issues

What is the missing lexer?

Astro components are commonly used in documentation sites, static sites, and blogs.

Astro files combine several syntactic regions:

  • frontmatter/component script delimited by ---, usually TypeScript/JavaScript
  • an HTML-like component template
  • JavaScript/TypeScript/TSX-style expressions inside {...}
  • Astro template directives such as client:*, server:*, class:list, set:html, set:text, is:*, transition:*
  • embedded <script> and <style> blocks, including language/type-specific JS, TS, JSON, CSS, SCSS, Sass, Less, Stylus, etc.
  • component tags such as <MyComponent /> in addition to normal HTML/custom elements

A basic lexer would already be useful if it recognized .astro, highlighted the frontmatter as TypeScript/JavaScript, the template as HTML-like markup, and {...} template expressions as TSX/TypeScript where possible.

Links to existing syntax definitions

Current official Astro language tools in the Astro monorepo:

Astro syntax/documentation references:

Additional grammar reference:

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions