Allow images to be optional, and do not download if the image field is missing

[holly-cummins]

In my data model, the remote image may be present, or the field may just be blank. If the field is missing, the remote plugin image has a noisy error, and initialisation of my site is affected:

 ERROR 

gatsby-plugin-remote-images ERROR: Error: url passed to createRemoteFileNode is either missing or not a proper web uri: undefined

  Error: Error: url passed to createRemoteFileNode is either missing or not a proper web uri: undefined

  - gatsby-node.js:162 createImageNode
    [extensions.quarkus.io]/[gatsby-plugin-remote-images]/gatsby-node.js:162:60

I've checked the docs, and I can't see any way of designating a path as optional, and telling the plugin not to try to download the image if the URL isn't there.

I'm working around the problem by providing a failover URL, but it's resulting in lots of wasted downloads.

    {
      resolve: `gatsby-plugin-remote-images`,
      options: {
        nodeType: "MyNodeType",
        imagePath: "fields.logoUrl",
        // Failover, make sure there is always an image
        prepareUrl: url =>
          url
            ? url
            : "https://dummyimage/image.png",
      },
    },

[graysonhicks]

Hm, should be allowed to use optional. What version are you using?

[holly-cummins]

I'm using

 "gatsby-plugin-remote-images": "^3.6.0-alpha",

When I'd looked I couldn't find any specific config for optional. I just speculatively tried optional: true instead of the prepareUrl, but it gives the same failure:

  Error: Error: url passed to createRemoteFileNode is either missing or not a proper web uri: undefined

[graysonhicks]

Can you post a reproduction? By optional, I mean the plugin should automatically handles instances where that image doesn't exist.

[holly-cummins]

Ah, in my scenario the url value itself is undefined, so it's slightly different from the supported behaviour.

[holly-cummins]

I've identified a workaround which is less wasteful than supplying a fallback url. Although undefined isn't tolerated, empty arrays are:

   {
      resolve: `gatsby-plugin-remote-images`,
      options: {
        nodeType: "MyNodeType",
        imagePath: "fields.logoUrl",        
        type: "array",
        prepareUrl: url => (url ? [url] : []),
      },
  }

[holly-cummins]

Actually, I spoke too soon. The array trick makes missing images be tolerated, but the localImage array is always empty, even if there are images. I'm not sure what causes that.

[ryan-talus]

I hit this issue today as well, so I added a PR of the workaround I'm using in my site in case that's useful!

[graysonhicks]

Fix released with 3.6.3 thanks!