search

timhagn / gatsby-background-image

Lazy-loading React (multi)background-image component with optional support for the blur-up effect.
MIT License
253 stars 49 forks source link

Background Image not showing after gatsby build #175

Closed MadalitsoNyemba closed 2 years ago

MadalitsoNyemba commented 2 years ago

Summary

I am using images from a graphCms model as background images and they are displayed with no problem. When I build the project, the images are not displayed.

Relevant information

When I manually input the background-image:url() in the generated html code then the background image is shown. All other images from graphCms are being shown with no issues even after gatsby build.

below is generated html after i ran gatsby develop develop

below is generated html after i ran gatsby build build

but when I manually input the generated code from the previous image into the generated build, the image is displayed.

this is sample on how I reference the image <BackgroundImage Tag="section" {...convertToBgImage(getImage(slide.image))} style={{ backgroundSize: 'cover', backgroundRepeat: 'no-repeat', }}>

this is my graphQl allGraphCmsSlider { nodes { image { gatsbyImageData } } }

Kindly assist where I have it wrong.

MadalitsoNyemba commented 2 years ago

Found it at issue #152