Stack Overflow
Stack Overflow

Questions tagged [gatsby-image]

Questions related to the gatsby-image plugin. https://www.gatsbyjs.org/packages/gatsby-image/

292 questions
16
votes
1 answer

Strapi dynamic zone - display image in Gatsby

I am using Strapi with Gatsby and having difficulty rendering images within a dynamic zone. I am using: Strapi 3.6.2 Gatsby 3.5.1 gatsby-source-strapi 1.0.0 gatsby-plugin-image 1.5.0 gatsby-plugin-sharp 3.5.0 gatsby-transformer-sharp 3.5.0 Top…
Kiee
  • 10,661
  • 8
  • 31
  • 56
10
votes
2 answers

Twitter Card Images not working on Gatsby app

I'm working on a Gatsby app with Netlify CMS (and hosted on Netlify). Trying to get the metadata working so that Twitter cards display correctly with images. The metadata is generally all right, but the images aren't showing on the Twitter validator…
Sasha
  • 6,224
  • 10
  • 55
  • 102
8
votes
0 answers

Missing Types in Gatsby with GatsbyImageData and Mdx

I have a site using Gatsby (with gatsby-plugin-image) and I am trying to refactor to Typescript. This is my first experience with ts I have a layout page that uses a pagequery that pulls Mdx data, however I am missing some types though and wondered…
Nick Wild
  • 525
  • 1
  • 11
  • 22
8
votes
1 answer

How to allow optional sharp image in graphql gatsby?

I typically have frontmatter that will have an array of objects, inside each object will be an image which will reference a string of a file relative to the markdown file. The problem is, the array could sometimes be empty, meaning graphql will have…
Joe Methven
  • 518
  • 4
  • 15
7
votes
1 answer

Gatsby throws SIGSEV error when running in GitHub Actions CI

I have a problem running gatsby build on my Gatsby site that only occurs when running in a Github Actions container. It doesn't always happen, either; as a good example, today Dependabot started 12 PRs and two of them failed with this error. The…
Jansky
  • 1,455
  • 1
  • 17
  • 33
6
votes
3 answers

gatsby-image-plugin, StaticImage cannot override the default wrapper style (gatsby-image-wrapper & gatsby-image-wrapper-constrained style)

I'm using GatsbyJS with TailwindCSS, When i tried passing tailwind styles into the wrapper of StaticImage from gatsby-image-plugin, the existing styles are not getting overridden (ie. gatsby-image-wrapper and gatsby-image-wrapper-constrained…
TridentKing
  • 61
  • 1
  • 5
6
votes
2 answers

How to pass a path of image as a prop in Gatsby in Gatsby-plugin-image

I am trying to pass a path of an image as a prop to a component Note: Both the component and the index page can access the image through the same path. It is not working when i pass the path as a prop In the below code i have tried with both…
Sanjay Kapilesh
  • 269
  • 1
  • 4
  • 16
6
votes
3 answers

Gatsby Contentful embedded image

As I see there is no json option anymore when querying the contentfulBlogPost only raw. I was able to make some changes to get everything from the body, except the image from that post. If I made a test in GraphQL Playground I can get the image id…
gatsbynewbie
  • 63
  • 3
6
votes
2 answers

GitHub Actions fail with Gatsby Error: Input file contains unsupported image format

I use Gatsby and NetlifyCMS for my website and currently get the following error message at running Workflow in GitHub Actions: error "gatsby-plugin-manifest" threw an error while running the onPostBootstrap lifecycle: Error: Input file contains…
Arbnor
  • 2,190
  • 18
  • 26
6
votes
1 answer

is there a good react carousel components that will work with gatsby-image?

I'm trying to make a carousel to display some images of projects I've done. I know there are a lot of react carousel components around, so does anyone know of one that will work well with gatsby-image?
zer0day
  • 236
  • 1
  • 3
  • 11
6
votes
1 answer

Make an image optional in netlify cms and gatsby js

I have a fairly simple Gatsby & Netlify CMS site. I can't cope with making images optional. In case of Netlify CMS it's just a matter of setting one field required: false. How do I write a query for Gatsby so I don't get an error 'GraphQL Error…
user1346765
  • 172
  • 1
  • 15
5
votes
1 answer

gatsby-plugin-image | Does not display the image

I want to optimize all the images on my Gatsby site and to achieve that I have installed the gatsby-image-plugin. For the dynamic images, I am using the GatsbyImage Component and everything is working fine, no issues here. The problem is when I…
tateccf
  • 115
  • 1
  • 9
5
votes
2 answers

StaticImage in GatsbyJS keep format SVG

i have this code gatsby-plugin-image reformat my svg on WebP format. Its…
Petr Volny
  • 150
  • 2
  • 12
5
votes
1 answer

Using dynamic external urls in StaticImage in Gatsby

I'm trying to display couple of images from array of objects containing images urls. I'm aware that StaticImage has to accept local variables as props values. These two variables for image urls are both local. Why is this not working and is there a…
Andrey Posudevsky
  • 117
  • 10
5
votes
3 answers

Why is gatsby-plugin-image missing image prop?

I am working on improving my image sizes and noticed that gatsby image was deprecated so I decided to try on the gatsby-plugin-image. On static images like this:
Jukka Koivu
  • 269
  • 4
  • 15
1
2 3
…
19 20