GraphQL Query обращается ко всем преобразованным json файлам в папке, расположенной в подкаталогах

Question

У меня есть такая структура проекта:

-$PROJECT
--src
---data
----projects
-----project1
------project.json
------images
-------project1-preview.png
-----project2
------project.json
-------images
...

И так далее, для многих проектов. Я мог запросить эти файлы проекта. json, когда им было присвоено название проекта и в папке projects, используя allProjectsJson в graphQl, однако теперь они находятся во вложенных папках в projects. Я могу только запросить их индивидуально, как allProject1 Json и так далее. Есть ли способ запросить allProjects Json, чтобы я получил все файлы проекта. json?

Я могу найти файлы своих проектов, запросив allFile с фильтром для файлов json, однако, эти файлы не преобразованы json, поэтому я не могу получить доступ к элементам.

В моем файле gatsby-config я импортирую src / data как источник для файлов.

Answer 1

Из моего ответа на https://github.com/gatsbyjs/gatsby/issues/20734:

Ах, я понимаю, что вы имеете в виду :) К счастью, gatsby-transformer-json имеет опцию плагинов, которая поможет вам отклеиться!

Это опция typeName . Вы должны быть в состоянии проверить поле на каждом JSON узле и использовать его в качестве имени типа. Примерно так:

    {
      resolve: `gatsby-transformer-json`,
      options: {
        typeName: ({ node, object, isArray }) =>
          object.project ? `Project` : `Json`,
      },
    },

Таким образом, все с определенным полем project будет отображаться как allProject { ... }, где любые другие файлы json будут отображаться как allJson { ... }

* 1018. *

{
  "data": {
    "allProject": {
      "nodes": [
        {
          "project": "project1"
        },
        {
          "project": "project2"
        }
      ]
    }
  }
}

Answer 2

Мой проект работает очень похоже. Вот как у меня есть gatsby-config.js setup:

module.exports = {
  ...
  plugins: [
    ...,
    {
      resolve: 'gatsby-source-filesystem',
      options: {
        name: 'project',  // Identifier. Will then be queried as `allProjectsJson`
        path: './data',   // Source folder containing the JSON files
      },
    },
    ...,
  ]
};

Пример JSON file:

[
  {
    "title": "Hello",
    "description": "World",
    "url": "https://www.google.com",
    "image": "./images/img1.jpg"
  },
  {
    "title": "World",
    "description": "Hello",
    "url": "https://www.google.com",
    "image": "./images/img2.jpg"
  },
]

Пример запроса:

query projects {
  allProjectsJson {
    edges {
      node {
        id
        title
        description
        url
        image {
          childImageSharp {
            fluid {
              ...GatsbyImageSharpFluid
            }
          }
        }
      }
    }
  }
}

Надеюсь, это поможет!