在Gatsby中使用graphQL查询多个JSON文件

我正试图查询两个我放在

src/data

目录中的

JSON

文件。我安装了

gatsby transformer json

，并添加了目录作为源代码

{
  resolve: `gatsby-source-filesystem`,
  options: {
    path: `${__dirname}/src/data/`
  }
}

然后我尝试了几种方法来构建graphql查询，但我只能成功地查询我创建的第一个json文件

work\u experiences.json

，看起来像这样，尽管我的第二个文件

skills.json

具有完全相同的结构

{
  "work_experiences": [
    {
      "body": "lorem ipsum",
      "title": "lorem ipsum",
      "role": "lorem",
      "dateBegin": "2015-10-01",
      "dateEnd": "2016-07-03",
      "companyUrl": "http://www.lorem.com",
      "workUrl": "/lorem/ipsum/"
    },
    ...

对skills.json的查询始终返回

null

---

有没有办法同时查询这两个文件，或者我必须将所有内容合并到一个

data.json

文件中？

如果您在同一根文件夹中有两个文件，并且要进行查询，那么您只能从单个节点获取数据，因为

dataJson

查询到单个文件中

或者像这样使用

allDataJson

：

{
  allDataJson{
    edges{
      node{
        work_experiences{
          title
        }
        skills{
         name
        }
      }
    }
  }
}

在本例中，一个好的解决方案是将单个对象json文件存储在单独的文件夹中，每个文件夹仅存储一个json

例如，您有一些

用户

数据：

• 在src/data中创建一个

  User

  文件夹
• 使用

  {“name”：“blabla”}

  创建index.json文件
• 查询您的数据

像这样：

{
  userJson{
    name
  }
}

---

@艾曼是对的。然后，您可以将查询设置为调用多个单独的JSON文件：

export const pageQuery=graphql`
查询索引查询{
allSocialJson{
边缘{
节点{
网址
类型
}
}
}
allExperienceJson{
边缘{
节点{
身份证件
公司
标题
}
}
}
allCertificationsJson{
边缘{
节点{
名称
身份证件
开始
结束
权威
}
}
}
allEducationJson{
边缘{
节点{
身份证件
学校
程序
}
}
}
}
`

我也遇到了同样的问题，并复制了@Aymen的方法

我试图使用下面的两个插件（

gatsby源文件系统

和

gatsby transformer json

）将多个json文件加载到我的gatsby站点

下面是如何设置我的

gatsby config.js

文件：

 const path = require(`path`)

 module.exports = {
  siteMetadata: {
    title: "My Homepage",
  },
  plugins: [
    `gatsby-transformer-json`,
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `data`,
        path: path.join(__dirname, `data`),
      },
    },
  ],
}

首先，在我的数据文件夹中，我创建了单独的文件夹

接下来，我将index.json文件添加到每个单独的文件夹中。项目文件结构如下所示：

然后，我可以通过以下单个查询访问所有index.json文件的数据：

---

我将这两个文件合并到一个

data.json

文件中，虽然感觉不太对劲，但它似乎可以工作。您可以将json文件添加到您的问题中以了解技能吗？非常详细的答案。恭喜。这将是我公认的答案！！你救了我几个小时。

src 
-- data 
---- folder1
------ index.json
---- folder2
------ index.json
---- folder3
------ index.json

query MyQuery {
  allIndexJson {
    edges {
      node {

      }      
    }    
  }
}