Каков наилучший способ заставить мою установку Gatsby извлекать изображения с S3? - PullRequest
Новая
       47

Каков наилучший способ заставить мою установку Gatsby извлекать изображения с S3?

0 голосов
/ 25 февраля 2020

Я пытаюсь включить ai2 html в репозиторий, построенный в Гэтсби. Я быстро понял, что не могу просто использовать gatsby-image, потому что я не развертываю все в одном месте: мой код через public/index.html отправляется в одно место, а мои изображения живут в AWS S3. Я ищу способ вытащить изображения через URL в мой src/index.js, в идеале пошаговое руководство, потому что я новичок в Gatsby.

Пока я пытался использовать gatsby-source-s3 (документы здесь ), но я не уверен, что правильно настроил в своем index.js (я уже установил его и поместил соответствующую информацию в gatsby-config.js: 

import React from "react"
import { useStaticQuery, graphql } from "gatsby"
import "../styles/ai_styles.css"

export default () => {

const data = useStaticQuery(graphql`
  query IndexQuery {
    images: allS3Images {
      edges {
        node {
          Key
          Url
        }
      }
    }
  }
`)

return (

<div>

<div id="g-crime-box" className="ai2html ai2html-box-v5">
        <div id="g-mobile" className="g-artboard" style={{width: '280px', height: '2328.3424680476px'}} data-aspect-ratio="0.12" data-min-width="280" data-max-width="579">
          <Img fluid={data.images.node.Url} alt="alt desktop image" />

...

</div>

Мои основные вопросы: {data.images.node.Url} лучший способ назвать изображение или я делаю это неправильно? И это лучший способ сделать это? Кто-нибудь видел другие способы сделать это?

...