Upgrading Gatsby Project to V3 - Attempted import error: 'getFluidGatsbyImage' is not exported

1 replies
Last updated: Mar 19, 2021
Hey everyone, I’m trying to upgrade a Gatsby project to V3 and get this error when trying to load fluid images from inside my Richtext renderer. I’m using the serializer for type “figure” and query the Sanity images using this snippet…
import React from "react"
import Img from "gatsby-image"
import { getFluidGatsbyImage } from "gatsby-source-sanity"
import * as css from "./figure.module.css"

const Figure = ({ node }) => {
  const fluidProps = getFluidGatsbyImage(
    node.image.asset._ref,
    { maxWidth: 1024 },
    {
      projectId: process.env.SANITY_PROJECT_ID || "bjzgdow4",
      dataset: process.env.SANITY_DATASET || "production",
    }
  )

  return (
    <figure className={`css.root my-6`}>
      <Img fluid={fluidProps} alt={node.alt} />
      {node.caption && (
        <figcaption className={css.figcaption}>{node.caption}</figcaption>
      )}
    </figure>
  )
}

export default Figure
Unfortunately, I get this error now in V3?

warn Attempted import error: 'getFluidGatsbyImage' is not exported from 'gatsby-source-sanity' (imported as 'getFluidGatsbyImage').
Thanks – any inputs and help much appreciated
🙂
Mar 19, 2021, 6:03 AM
Oh silly me, never mind. This is all well documented in the migration path here . Thanks Sanity!
Mar 19, 2021, 6:16 AM

Sanity – Build the way you think, not the way your CMS thinks

Sanity is the developer-first content operating system that gives you complete control. Schema-as-code, GROQ queries, and real-time APIs mean no more workarounds or waiting for deployments. Free to start, scale as you grow.

Was this answer helpful?