I have been using plaiceholder for getting base64 converted image to pass in blurDataUrl in next/Image component.
export const getStaticProps = async () => {
const { base64, img } = await getPlaiceholder(
"imagePath",
{ size: 10 }
);
return {
props: {
imageProps: {
...img,
blurDataURL: base64,
},
},
};
};
const PageBase64Single = ({ title, heading, imageProps }) => (
<Image {...imageProps} placeholder="blur" />
);
Here I have 2 problems:
Stuck since a long time, kindly help