ElMassimo / iles

🏝 The joyful site generator
https://iles.pages.dev
MIT License
1.08k stars 32 forks source link

Incompatibility with `rehype-slug-custom-id` plugin due to `#` parsing #205

Closed lucperkins closed 1 year ago

lucperkins commented 1 year ago

I was hoping to use the rehype-slug-custom-id plugin with iles but I ran into this error when using it:

[plugin:iles:mdx:compile] Could not parse expression with acorn: Unexpected character '#'

The MDX snippet that produced this:

## Here is my heading {#custom-id}

To be clear, I would not expect iles to support every single rehype plugin in existence (!), but I nonetheless wanted to report this in case it's unexpected that the MDX parser would reject # in a heading.

Greetings from across the Rio de la Plata 😄

ElMassimo commented 1 year ago

Hi Luc! 👋

The syntax that you are trying to use is incompatible with MDX:

Could not parse expression with acorn: Unexpected character '#'

It's trying to parse #custom-id as if it were a JS expression, because it's inside brackets. Try:

## Here is my heading \{#custom-id}

As an alternative, you could use <h2 id="custom-id">, it will end up being more portable than the custom syntax supported by rehype-slug-custom-id.

lucperkins commented 1 year ago

@ElMassimo Oooooh! 🤯 Thanks a million! 🚀 ❤️