I am using Astro Picture component.
I use inferRemoteSize()
. To infer the dimensions of remote images.
But sometimes the imageUrl is null
.
// MyImageComponent.astro
import { inferRemoteSize, Picture } from 'astro:assets';
const { title, imageUrl, copyright } = Astro.props;
const { width, height } = await inferRemoteSize(imageUrl);
<figure>
<Picture
src={imageUrl}
alt={title}
width={width}
height={height}
formats={['avif', 'webp']}
widths={[240, 540, 720, width]}
sizes={`(max-width: 360px) 240px, (max-width: 720px) 540px, (max-width: 1600px) 720px, ${width}px`}
/>
</figure>
How to fix this issue?