Either strPlaceholder doesn't work or I'm doing it wrong...please help.

[badaczewski]

From what the documentation says, I should be able to reference a 540x405 blue placeholder (my use case) image via srcPlaceholder and this should appear before the image loads...as well as occupy the space the image will be before it loads. I've tried this and I'm getting noting. I can't see the image nor do I see it referenced in the source or generated CSS classes.

Below is how I'm using it, please help.

import { LazyLoadImage } from 'react-lazy-load-image-component';
import 'react-lazy-load-image-component/src/effects/opacity.css';

I see everything loading with the assigned classes and the images do fade in quickly, so the above is correct

<LazyLoadImage loading="lazy" effect="opacity" src={prop.image_url} placeholderSrc="/placeholder_540x405.webp" />

Image loads with opacity but there is no placeholder before it loads the container is collapse until the image appears.