Skip to content

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

@AdamGEmerson

Description

@AdamGEmerson

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.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions