prettier-plugin-astro icon indicating copy to clipboard operation
prettier-plugin-astro copied to clipboard

🐛 BUG: Throws an error on Astro templating expression that returns multiple elements

Open AdamGEmerson opened this issue 11 months ago • 1 comments

Describe the Bug

It appears that .astro templating expressions are being identified as JSX and prettier is throwing an error if you attempt to return multiple adjacent elements in one expression. However, multiple elements are allowable within Astro and should not display an error.

Astro docs on returning multiple elements: https://docs.astro.build/en/reference/astro-syntax/#multiple-elements

Example code:

<dl class="flex flex-col gap-4 md:gap-4 mb-8" >
  {features.map(feature => (
    <dt class="flex gap-4 flex-0 w-full">
    	<Image src={feature.icon} alt={feature.iconAlt} class="w-6 h-6" />
    	<h3 class="text-base leading-normal sm:text-lg md:text-xl text-accent-700 font-medium">
    	  {feature.title}
    	</h3>
    </dt>
    <dd class="w-full">
    	<p class="text-base text-base-900 leading-normal mt-4 font-normal">
    	  {feature.description}
    	</p>
    </dd>
  ))}
</dl>

And the resulting error: Image

Steps to Reproduce

The bug can be reproduced by attempting to return two elements in a single Astro expression and then running the prettier formatter.

AdamGEmerson avatar May 19 '25 14:05 AdamGEmerson

I think this is the same issue as #429

AdamGEmerson avatar May 21 '25 16:05 AdamGEmerson