withastro/astro

🐛 BUG: SASS content incorrectly highlighted as CSS syntax when `lang='sass'` is not on the same line with `<style`

Offen

#14.657 geöffnet am 17.01.2025

Auf GitHub ansehenContributor Guide
 (14 Kommentare) (0 Reaktionen) (0 zugewiesene Personen)TypeScript (3.732 Forks)batch import
- P2: has workaroundfeat: syntaxgood first issuepkg: language-toolstriage: needs triage

Repository-Metriken

Stars
 (61.918 Sterne)
PR-Merge-Metriken
 (Durchschn. Merge 4T 23h) (197 gemergte PRs in 30 T)

Beschreibung

Describe the Bug

When the lang attribute of the <style> tag is not on the same line as the style tag, the content may be incorrectly highlighted as CSS syntax.

Steps to Reproduce

  1. npm create astro@latest
  2. open the project in vscode
  3. install newest astro extension
  4. create anyname.astro with the contents
<style
  lang="sass"
  define:vars={{
    // any comment to avoid formatter collapse content into a single line
    foo: '#fff',
  }}
>
  .bar
    color: var(--foo)
</style>
  1. the content below .bar (include </style>) will be incorrectly highlighted as css syntax, not sass.

Link to Minimal Reproducible Example

https://gist.github.com/HPCesia/6e935433cfd6e414099f71714cb4961d

Contributor Guide

Research-Richtung
Untersuchen Sie die Grammatik oder die Syntaxhervorhebungslogik für `<style>` Tags in der Astro VS Code Erweiterung. Insbesondere, wie die Sprache abgeleitet wird, wenn das `lang` Attribut in einer anderen Zeile als `<style>` steht. Der Fehler deutet darauf hin, dass die Grammatik einen einzeiligen Regex verwendet oder mehrzeilige Attribute nicht analysieren kann. Überprüfen Sie die TextMate Grammatik oder den semantischen Token Provider für Astro Dateien.
Tech Stack
typescript
Domain
frontend
Issue Type
Fehler
SchwierigkeitGeschätzte Implementierungsschwierigkeit für neue Contributors, von 1 für sehr kleine Änderungen bis 5 für Expertenarbeit.
2
Geschätzte ZeitEin grober Zeitrahmen, um zu recherchieren, zu implementieren, zu testen und einen Pull Request vorzubereiten.
1-3 Stunden
AktivitätsstatusWie verfügbar das Issue gerade wirkt: frisch, aktiv, stale, blockiert oder wartet auf Maintainer-Input.
Aktiv
KlarheitWie klar das Issue die erwartete Änderung, Akzeptanzkriterien und den nächsten Schritt erklärt.
Meist klar
Voraussetzungen
GitVS Code extension development basics
EinsteigerfreundlichkeitEin Score von 1 bis 100, der schätzt, wie zugänglich dieses Issue für First-Time Contributors ist.
60