Gatsby Plugin Sharp error after upgrading to v3.10.0

[t2ca]

Preliminary Checks

• This issue is not a duplicate. Before opening a new issue, please search existing issues: https://github.com/gatsbyjs/gatsby/issues
• This issue is not a question, feature request, RFC, or anything other than a bug report directly related to Gatsby. Please post those things in GitHub Discussions: https://github.com/gatsbyjs/gatsby/discussions

Description

I am having the following error once I upgraded to Gatsby v3.10.0

In development when navigating to a page with images.

Cannot read property 'del' of undefined

  TypeError: Cannot read property 'del' of undefined

  - gatsby-node.js:72
    /[gatsby-plugin-sharp]/gatsby-node.js:72:23

Reproduction Link

n/a

Steps to Reproduce

1. Upgrade to v3.10.0
2. gatsby develop
3. Navigate to page with images

Expected Result

No error

Actual Result

Cannot read property 'del' of undefined

  TypeError: Cannot read property 'del' of undefined

  - gatsby-node.js:72
    /[gatsby-plugin-sharp]/gatsby-node.js:72:23

Temporary Fix

Open node_modules/gatsby-plugin-sharp/gatsby-node.js

Replace lines 72 - 80 with the following:

    await cache?.cache?.del(decodedURI);

    if (jobWithRemainingOperations.args.operations.length > 0) {
      // There are still some operations pending for this job - replace the cached job
      await cache?.cache?.set(jobContentDigest, jobWithRemainingOperations);
    } else {
      // No operations left to process - purge the cache
      await cache?.cache?.del(jobContentDigest);
    }

[hendra-go]

confirmed. I experienced it too.

[LekoArts]

Hi!

Please provide a minimal reproduction as asked for in the issue template.

I used npm init gatsby temp -y, updated to [email protected] and installed gatsby-plugin-sharp, gatsby-transformer-sharp and used this one the index page:

import * as React from "react"
import { graphql } from "gatsby"

const pageStyles = {
  color: "#232129",
  padding: 96,
  fontFamily: "-apple-system, Roboto, sans-serif, serif",
}

const IndexPage = ({ data }) => {
  return (
    <main style={pageStyles}>
      <title>Home Page</title>
      <h1>Test Page</h1>
      <img alt="" src={data.imageSharp.gatsbyImageData.images.fallback.src} />
    </main>
  )
}

export default IndexPage

export const query = graphql`
  query {
    imageSharp {
      gatsbyImageData
    }
  }
`

I didn't see any errors during gatsby develop or gatsby build. Please provide a reproduction, thanks!

[pieh]

This seems to happen when gatsby develop is used with LMDB_STORE flag and visiting dev site that would trigger lazy image processing. Was able to reproduce locally, will start working on a fix.

[LekoArts]

Fixed in [email protected] and [email protected]