5

私のマークダウンファイルからindex.md、...

---
templateKey: home-page/index
image1: /img/City-Picture.jpg
---

...最適化されたものをここでimage1利用できるようにしたい...graphqltemplates/index.js

export const homePageQuery = graphql`
  query HomePage($id: String!) {
    markdownRemark(id: { eq: $id }) {
      frontmatter {
        welcome_description
        image1 {
          childImageSharp {
            sizes(maxWidth: 590) {
              ...GatsbyImageSharpSizes
            }
          }
        }
      }
    }
 }

しかし、ターミナルでこのエラーが発生します...

GraphQL Error Field "image1" must not have a selection since type "String" has no subfields.
2 |   query HomePage($id: String!) {
3 |     markdownRemark(id: { eq: $id }) {
4 |       frontmatter {
5 |         welcome_description
6 |         image1 {
  |                ^
7 |           childImageSharp {
8 |             sizes(maxWidth: 590) {
9 |               ...GatsbyImageSharpSizes
10|             }
11|           }
12|         }
13|       }
14|     }

(最適化を控えると、彼のエラーは発生しませんimage1。)

ではgatsby-config.js、これらのプラグインを前に配置していgatsby-source-filesystemます ...

`gatsby-plugin-sharp`,
`gatsby-transformer-sharp`,

GraphQLimage1が「文字列」型と見なす理由がわかりません。で、画像の相対パス ( )index.mdに変更しても、同じエラーが発生します。image1: /img/City-Picture.jpgimage1: ../..static/img/City-Picture.jpg

もちろん、/img/City-Picture.jpgNetlify CMS で画像更新のために機能するのはそれだけなので、そのままにしておくことをお勧めします。Netlify config.ymlCMS の場合、私は...

media_folder: static/img
public_folder: /img

...画像エディターが CMS で機能するためには、同じままにしておく必要があると思います。

gatsby-remark-relative-images Netlify CMS が相対パスを使用できないことを補うために、最近ビルドされたプラグインに実装しようとしましたが、動作させることができませんでした。

これについてはhttps://github.com/netlify/netlify-cms/issues/325で活発な議論が行われていますが、これまでのところ、どのソリューションも機能させることができませんでした。

今のところ、私は 2 つの不完全な選択肢のジレンマを抱えています。1. Netlify CMS で画像を編集する機能があるが、gatsby-image. 2. Netlify CMS で画像を編集する機能はありませんが、gatsby-image.

可能であれば、両方の長所を生かしたいと思っています。これに関する洞察は大歓迎です。

4

2 に答える 2