No known route from 'cmyk' to 'srgb

2019-06-22 14:24发布

问题:

CodeSandbox - https://codesandbox.io/s/jj597mrvmw

I am having an issue with some data returned from an external API to my GatsbyJS/ReactJS site.

More specifically, the issue appears to be when processing the images with gatsby-image and gatsby-plugin-sharp using the API ...GatsbyImageSharpFluid on GraphQL queries.

From the 1000's of images, it appears that only 1 is troublesome, returning the error

Errors:
  icc_transform: no input profile
  vips_colourspace: no known route from 'cmyk' to 'srgb'

I could just filter this image out but am concerned that future images as the API updates could cause the same issue.

How can I

  1. Fix this error presented by sharp so that the image can be processed? or,
  2. filter image(s) that return this error during processing of the createRemoteFileNode, or
  3. Skip troublesome image(s) within catch (error), or
  4. Any other thoughts/solutions

createRemoteFileNode within gatsby-node.js is as

exports.sourceNodes = async ({ actions, store, cache, createNodeId }) => {
  const { createNode, createNodeField } = actions;
  const { data } = await axios.get(API_URI);

  for (const event of data._embedded.events) {
    let fileNode;
    let output = [];
    let filterResults = event.images.filter(e => e.width >= 1900);
    output.push(...filterResults);
    try {
      fileNode = await createRemoteFileNode({
        url: output[0].url,
        cache,
        store,
        createNode,
        createNodeId,
      });
      await createNodeField({
        node: fileNode,
        name: 'EventImage',
        value: 'true'
      });
      await createNodeField({
        node: fileNode,
        name: 'name',
        value: event.name
      });
    } catch (error) {
      console.warn('error creating node', error);
    }
  }
};