Received unsupported format `undefined` from `undefined` | Astro Lounge | Page 1

round anchor Jun 23, 2023, 10:16 AM

#

Can I import an image directly into a component without having to declare the import beforehand? I am using the experimental astro assets.
<Image src={import('../assets/sport/sport-1.png')} format="webp" alt="sport" />

languid cave Jun 23, 2023, 10:18 AM

#

You need to await the import

#

Dynamic imports like that are async, so right now you're passing a Promise

round anchor Jun 23, 2023, 10:24 AM

#

languid cave You need to await the import

But I can't do await import directly in the component

languid cave Jun 23, 2023, 10:49 AM

#

Why not?

#

You can do src={await import(...)}

round anchor Jun 23, 2023, 11:07 AM

#

languid cave You can do `src={await import(...)}`

"await" can only be used inside an "async" function

languid cave Jun 23, 2023, 11:52 AM

#

Is this the error you get?

#

Astro components should always be able to do this

round anchor Jun 23, 2023, 12:05 PM

#

languid cave Is this the error you get?

yep

#

Error: Transform failed with 1 error:

#

ERROR: "await" can only be used inside an "async" function

#

#

import works if you use <@&1055234544183287879>/image/components instead of astro:assets

#

I just want to declare the path to the images in the array and then use map to display the data in the layout

#Received unsupported format `undefined` from `undefined`