#Can't infer width/high with astro:assets' <Image /> components

1 messages · Page 1 of 1 (latest)

crisp juniper
#

Looking at the doc for the new assets pipeline (https://docs.astro.build/en/guides/assets/#image--astroassets), it looks like one can use the <Image /> component without providing an height or width (they'd be inferred from the resolution of the image file). However, this doesn't work for me as I'll get the following TS error :

Type '{ src: string; alt: string; }' is not assignable to type 'IntrinsicAttributes & Props'.
  Type '{ src: string; alt: string; }' is not assignable to type 'IntrinsicAttributes & Simplify<RemoteImageProps<ImgAttributes>>'.
    Type '{ src: string; alt: string; }' is missing the following properties from type 'Simplify<RemoteImageProps<ImgAttributes>>': width, height

My code includes :

import { Image } from 'astro:assets';
import logo from '../assets/logo.png';

and

<Image src={logo} alt="logo" />

Any idea how to go past this ?

Astro Documentation

Learn how to enable experimental asset support in Astro.

cunning nebulaBOT
#
Quiet in here?

It looks like no-one has responded to your question yet. People might not be available right now or don’t know how to answer your question. Want an answer while you wait? Try asking our experimental bot in #1095492539085230272.

plain coral
#

You have the wrong types, have you ran the dev server?

#

Or you might have a dependency that's overriding the types

crisp juniper
#

Ahhh, you mean I should run the dev server once after settings up the assets configuration so that it updates src/env.d.ts ?
If so, it could be the pb, I'm in the middle of upgrading dependencies from a depo I haven't touched in few months, and didn't run the dev server yet.

#

(needed to update astro as I was on 2.0.6 that didn't support the asset pipeline)

#

Will need to debug this before seeing if that solves the types though.

plain coral
#

You can update it manually otherwise

#

In your env.d.ts, change the reference for astro/client-image instead of astro/client

#

We'll be making those types the default ones once assets isn't experimental anymore, it'll make things easier...

crisp juniper
#

ok, I fixed my issue in the astro config that was causing the issue.
I confirm that running the dev server did automatically update env.d.ts !

plain coral
#

Awesome

crisp juniper
#

Funnily enough the change doesn't appear in my git changes summary even though the file isn't in .gitignore, curious. But thanks for your help !

#

(I mean the change in env.d.ts )