GraphQL query data to be made available in Gatsby Cloud Functions

[nimajnebp]

Motivation:
Create an e-commerce site with a search/list/filter page that has product card images using GatsbyImage component.
On this page the data would be coming from Cloud Functions, all sorting, searching and filtering would happen in cloud functions.

Tried and failed:
Right now it is not possible to have a gatsby optimised product card image created on runtime, that happens on build time if it was queried at some point, then you have the optimised image assets created and the image data object available.
I was thinking that i could make a staticQuery for all product card images (i know this is not the most elegant way), then import that data into a cloud function, then i can do use that gatsbyImageData object without having to load it into my search page as page-data.

The problem with the solution above that the gatsby cloud function does not load this data and throws this error:

Module parse failed: Unexpected token (26:4) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders | | return ( > | {finalData && render(finalData)} | {!finalData &&
Loading (StaticQuery)
}

I'd love to hear opinions on this issue!