Unlock seamless workflows and faster delivery with our latest releases - Join the deep dive

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 remarkable experiences at scale

Sanity is a modern headless CMS that treats content as data to power your digital business. Free to get started, and pay-as-you-go on all plans.

Was this answer helpful?