Search code examples
graphqlgatsbystrapi

Gatsby: gatsby-source-graphql & gatsby-plugin-sharp in graphql query


I am using Gatsby v. 2.0.2. As a headless CMS I am using Strapi. I am trying to use gatsby-image, gatsby-plugin-sharp (image processing) with the pictures uploaded from Strapi.

My folder structure is:

>>projectfolder
   >>api
     >>public
       >>uploads (here my images are located)
   >>frontend (gatsby stuff)

similar to Gatsby-source-wordpress I would like to graphql query images like this:

query {
  api {
    projects {
      image {
        name
        url
        childImageSharp {
          resize(width: 180, height: 180) {
            src
          }
        }
      }
    }
  }
}

If I use the exports.onCreateNode I only get the parent node "api". How can I get the image URL so that createRemoteFileNode can be used?

Do I need to write exports.createPages, graphql query the api-node and then use createNode or createNodeField to create nodes?


I have tried to use to Gatsby-source-strapi with the same problem not being able to reach Gatsby-transformer-sharp.

query {
  allStrapiProject {
    edges {
      node {
        title
        image {
          name
        }
      }
    }
  }
}

Solution

  • This has been added in a very recent pull request and will be published in the next few days on npm: https://github.com/strapi/gatsby-source-strapi/pull/24.