Hi I am trying to use PrismicNextImage to handle all Prismic images in a Next.js v12 website. My component works fine and correctly handles images when using layout='fill' but some images need to have the width and height specified. When I try either 'width or height' or imgixParams={{ w: width, h:height }} I cannot control the size of the images.
Here is some of my .tsx component code for CustomImage.tsx:
My typescript interface is setup:
interface CustomImageProps {
field: string;
imgixParams?: Record<string, string | number>;
src: string;
alt: string;
width: number;
height?: number;
quality?: number;
}
Neither of these CustomImage's work:
return <PrismicNextImage field={field} alt={alt} width={width} height={height} quality={quality} {...restProps} />;
return <PrismicNextImage field={field} alt={alt} imgixParams={{w: width, h: height}} quality={quality} {...restProps} />;
Any help gratefully received.