Gatsby: Add support for querying SVGs as images

[kripod]

I think it would be great if public URLs for SVGs could be generated through ImageSharp. Currently, if I want to use vector and raster graphics interchangeably, I need to use some extra code similar to below:

let thumbnailSrc;
if (video.frontmatter.thumbnail != null) {
  thumbnailSrc =
    video.frontmatter.thumbnail.childImageSharp != null
      ? video.frontmatter.thumbnail.childImageSharp.sizes.src
      : `/${video.frontmatter.thumbnail.relativePath}`;
}

Also, I have to put all the related images to the /static folder and make them discoverable by gatsby-source-filesystem. Querying SVGs just like raster images would simplify this workflow by a lot.

[KyleAMathews]

I couldn't find the issue where this has been discussed before but what I suggest is that we add to File nodes (from gatsby-source-filesystem) the ability to "query" the file which will cause them to be copied to public/static with a content addressed path.

This would mean adding a new field e.g. publicLink (probably not the best name).

How's this sound? Would you like to do a PR?

[kripod]

This sounds absolutely great! Unfortunately, I'm pretty busy nowadays, so I cannot do a PR.

[kripod]

@KyleAMathews Also, I think this proposal might be interesting for Gatsby v2: https://github.com/facebookincubator/create-react-app/issues/3722

[CanRau]

publicURL has been added and works for me #3669
is this what you mean @kripod? or does it help?

[kripod]

@CanRau yeah, it’s fine now.