gatsby-background-image с svg не найден

Question

import React from "react"
import { StaticQuery, graphql } from "gatsby"
import styled from 'styled-components'
import BackgroundImage from 'gatsby-background-image'
import Slider from "react-slick";
import "./layout.css"

const BizTech = ({ className }) => (
  <StaticQuery
    query={graphql`
      query {
        desktop: file(relativePath: { eq: "foobar.svg" }) {
          childImageSharp {
            fluid(quality: 90, maxWidth: 1920) {
              ...GatsbyImageSharpFluid_withWebp
            }
          }
        }
      }
    `}
    render={data => {
      // Set ImageData.
      const imageData = data.desktop.childImageSharp.fluid

      const settings = {
      dots: true,
      infinite: true,
      slidesToShow: 1,
      slidesToScroll: 1,
      autoplay: true,
      speed: 500,
      cssEase: "linear"
    };
      return (
        <BackgroundImage Tag="section" className={className} fluid={imageData} backgroundColor={`transparent`} style={{ }}>
          <div style={{ }}>
            <h3>FOOBAR</h3>
          </div>
        </BackgroundImage>
      )
    }}
  />
)

const StyledBT = styled(BizTech)`
  width: 100%;
  background-position: bottom center;
  background-repeat: repeat-y;
  background-size: cover;
`
export default StyledBT

Когда указанный файл изображения является JPG, он найден и отображен. Если это SVG, как указано выше, это не так.

Answer 1

Как отметил @ksav в комментариях, использование исходных файлов SVG в настоящее время не поддерживается в рамках острой интеграции конвейера узлов.