Questions related to the gatsby-image plugin. https://www.gatsbyjs.org/packages/gatsby-image/
Questions tagged [gatsby-image]
292 questions
0
votes
1 answer
Forestry + Gatsby Image - reference image from JSON files
I'm looking into using Forestry with Gatsby (and use gatsby-plugin-image to optimize the images), but I'm stuck on how to get it working and not sure if it's even possible.
The first approach I tried (not working with Gatsby Image) is:
The image…
Sprouter
- 312
- 1
- 2
- 10
0
votes
1 answer
In Gatsby.js, use an image as li bullet
I am trying to use an image as an "li" bullet point. What I am trying tis to import the image as a "StaticImage" to use it in Styled Components, like this:
import { StaticImage } from "gatsby-plugin-image";
export function Bullet() {
return…
Sergi
- 1,192
- 3
- 19
- 37
0
votes
1 answer
Unable to load options for image in graphql using custom json
I'm developing a website using Gatsby, by referring https://www.youtube.com/watch?v=smHhNzM5Uo4
here he suggested to use graphql for displaying images. such that created a Trips.json, where mentioned the image details as below
[
{
"img":…
Arunkumar G
- 13
- 6
0
votes
1 answer
My images are not being displayed when using GatsbyImage/getImage()
I am attempting to create a gallery populating with .png's from src/projects/artwork directory.
I'm using GraphQl, Gatsby,gatsby-plugin-sharp,gatsby-plugin-sharp
gatsby-config.js
module.exports = {
plugins: [
`gatsby-plugin-sass`,
…
Guy Shifty
- 33
- 3
0
votes
1 answer
How do I use GraphQL to query an image from Contentful?
I am building a basic site with Gatsby and have connected it to Contentful. I uploaded 2 assets to Contentful:
First asset looks like:
The second asset is 100% identical other than the title which is test-two.
If I use the about query and pass in…
agw2021
- 266
- 2
- 22
0
votes
1 answer
Gatsby Image Not Found
So I am messing around with creating a markdown blog and for some reason I cannot get images to work.
Gatsby-config.js
plugins: [
'gatsby-plugin-image',
'gatsby-plugin-sharp',
'gatsby-transformer-sharp',
{
resolve:…
jrock2004
- 3,229
- 5
- 40
- 73
0
votes
1 answer
Netlify Build Error - appends ".jpg" to my Contentul Image
Hi I'm building a website with Gatsby version 4.2.0 and deploy with Netlify.
However, I kept getting errors like this regarding cache content in the Netlify log.
ENOENT: no such file or directory, open…
AskQuestion
- 21
- 5
0
votes
1 answer
Importing and displaying multiple images from GraphQL using gatsby-plugin-image
Hi I'm trying to add an instagram feed to my website but I can not find a way to make it work. I haven't really used these tools before so I don't really understand it, but made it to point where I think I have the feed in GraphQL. Now the problem…
EmFor
- 43
- 8
0
votes
1 answer
How to resolve migration error env: node\r: from Gatbsy-images to Gatsby-plugin-images with gatsby-codemods?
I have a ton of code I'd like migrate from gatsby-image to gatsby-plugin-image through gatsby-codemods. I have followed their docs here. So the problem is I use yarn for my project and get an `env: node\r: No such file or directory. I tried solving…
rockon_d
- 1,094
- 2
- 8
- 21
0
votes
1 answer
Best way to change image on hover using GatsbyImage
I do want my product images to change during mouse hover, but since GatsbyImage doesn't support onMouseEnter props, what is the best way to handle this?
The ProductImage:
user10229330
0
votes
1 answer
In Gatsbyjs, how to render markdown images when markdown is coming from a yaml object property?
I am working with a gatsbyjs app, where I have some .yml files that have following format:
My goal is to render value of markdownContent field as HTML. For that purpose, I first read contents of these .yml files using 'gatsby-transformer-yaml'…
Farooq Hanif
- 1,779
- 1
- 15
- 22
0
votes
1 answer
How to Query Images via GraphQL with the gatsby-plugin-image plugin
Hi I'm using Prismic as a Headless CMS and want to Query out images within the gatsby-plugin-images plugin. Unfotunatly I got no error message or anything else, its just not working.
class Index extends Component {
render() {
const {
…
Martin Bock
- 3
- 3
0
votes
1 answer
How to properly render images using a map function with Gatsby.js
This app was originally built using react, however we have decided to convert everything over and use Gatsbyjs. I am new to Gatsby and I am trying to get my images to render correctly using the artist data.
Here is how this part of the data was…
Sherre Ahlers
- 71
- 1
- 11
0
votes
1 answer
GatsbyImage working when pulling data locally but not with Strapi and Gatsby
I'm on the verge of quitting (again!!) but keeping at it..
Would really appreciate some help on this or my laptop may be thrown out the window soon!
I set up a project locally and am now linking it to content on Strapi. I'm able to add the text…
sbloxy88
- 13
- 3
0
votes
0 answers
I can see my images with gatsby develop, but not on production site
I have my site's images stored in the src/images folder in my Gatsby project. I reference those files in components after importing them from the images folder, like so:
Within index.js:
import myImage from '../images/flag.jpeg'
import…
Willy
- 322
- 1
- 17