imageSharp returning null

[steoneill]

Hi, I've tried a few different images incase it's that, alongside changing the actual name on the content model too.

Have i missed anything ?

[ohlr]

please provide code

[steoneill]

{
      resolve: "gatsby-source-prismic-graphql",
      options: {
        repositoryName: "littleboat",
        accessToken: process.env.PRISMIC_SECRET,
        pages: [
          {
            type: "Landing_page",
            match: "/",
            filter: data =>
              console.log({ data }) || data.node._meta.uid === "homepage",
            path: "/hompage-preview",
            component: require.resolve("./src/templates/landing_page.js"),
          },
          {
            type: "Landing_page",
            match: "/:uid",
            filter: data => data.node._meta.uid !== "homepage",
            path: "/page-preview",
            component: require.resolve("./src/templates/landing_page.js"),
          },
        ],
        sharpKeys: [
          /image|photo|picture/, // (default)
          "partner",
        ],
      },

from the gatsby-config

"dependencies": {
    "classnames": "^2.2.6",
    "gatsby": "^2.22.15",
    "gatsby-image": "^2.4.5",
    "gatsby-plugin-manifest": "^2.4.9",
    "gatsby-plugin-offline": "^3.2.7",
    "gatsby-plugin-postcss": "^2.3.3",
    "gatsby-plugin-react-helmet": "^3.3.2",
    "gatsby-plugin-sharp": "^2.6.9",
    "gatsby-source-filesystem": "^2.3.8",
    "gatsby-source-prismic": "^3.1.2",
    "gatsby-source-prismic-graphql": "^3.6.3-alpha.12",
    "gatsby-transformer-sharp": "^2.5.3",
    "prismic-reactjs": "^1.3.1",
    "prop-types": "^15.7.2",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "react-helmet": "^6.0.0",
    "tailwindcss": "^1.4.6",
    "typeface-spartan": "^1.1.4"
  },

deps from package.json

i've tested it in graphiql and get null there, as well as when queried at page level. None imageSharp returns url etc

[ohlr]

How does your query look like? did you have a look at https://github.com/birkir/gatsby-source-prismic-graphql/issues/196

[steoneill]

How does your query look like? did you have a look at #196

I've made the change but sadly no go!

export const query = graphql`
  query getLandingPage($uid: String!) {
    prismic {
      landing_page(lang: "en-gb", uid: $uid) {
        page_title
        body {
          ... on PRISMIC_Landing_pageBodyLarge_header {
            type
            label
            primary {
              title
              header_copy
              imageSharp {
                childImageSharp {
                  fluid {
                    ...GatsbyImageSharpFluid
                  }
                }
              }
            }
          }
        }
      }
    }
  }
`

here's my query, thanks again for helping!

[lucashfreitas]

Hey @steoneill,

To access imageSharp node you also need to declare the original Image field name in graphql query. It's really strange and it sounds like a bug, but I manage to solve this problem by doing that.

Just add the original image field name to your query like:

image //original Image field name - you need to include this in your query
imageSharp {
                childImageSharp {
                  fluid {
                    ...GatsbyImageSharpFluid
                  }
                }
              }

[steoneill]

Ahhh @lucashfreitas ! you star

That's got that working! Thank you :D