withastro / language-tools

Language tools for Astro
MIT License
240 stars 45 forks source link

feat: highlight Astro code blocks in MDX #878

Open remcohaszing opened 1 month ago

remcohaszing commented 1 month ago

Changes

This adds support for syntax highlighting astro tagged code blocks inside MDX files.

This is MDX

```astro
---
const frontmatter = 'This is Astro frontmatter'
---

<div>This is an Astro template</div>


![image](https://github.com/withastro/language-tools/assets/779047/23e1ab92-980c-452d-a33d-0bcb48d25bdd)

## Testing

With the [MDX extension](https://marketplace.visualstudio.com/items?itemName=unifiedjs.vscode-mdx) installed, open the Astro language tools repo and create an Astro code block inside an MDX file.

## Docs

I don’t know what documentation would be needed for this.
changeset-bot[bot] commented 1 month ago

🦋 Changeset detected

Latest commit: da87c6ee6161a84fcd7dcf0ab4dac65a58069d5c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package | Name | Type | | ------------ | ----- | | astro-vscode | Patch |

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

Princesseuh commented 1 month ago

I know we do it that way in Markdown, but I don't know why we redefine the frontmatter and stuff. Couldn't we just apply source.astro to code blocks with the astro language?

remcohaszing commented 1 month ago

Without it the frontmatter content isn’t highlighted. I don’t understand why.

I did simplify it a bit now.