无法查询字段“x"在类型“y"上

本文介绍了无法查询字段“x"在类型“y"上的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我需要一些有关 Graphql 查询的帮助:).我正在尝试将投资组合网站部署到 Netlify，在部署期间，我收到此错误.我的代码在 localhost 上运行，但不在 Netlify 上运行.我需要从 Contentful 中提取数据并用它填充图片库.

预期结果:Netlify 部署我的代码

我得到的结果:构建错误.

您的 GraphQL 查询中出现错误:2:51:25 AM:无法查询字段标签"在ContentfulArt"类型上.2:51:25 AM:如果你不期待标签"存在于ContentfulArt"类型上这很可能是一个错字.但是，如果您期望标签"要存在，有几种常见问题的解决方案:2:51:25 AM:-如果您添加了新数据源和/或更改了 gatsby-node.js/gatsby-config.js 中的某些内容，请尝试重新启动您的开发服务器2:51:25 AM:- 该字段可能在另一个子字段中可访问，请尝试在 GraphiQL 中查询并使用 GraphiQL 资源管理器查看您可以查询哪些字段以及它们具有什么形状2:51:25 AM: - 您想选择性地使用您的字段标签"现在它没有在任何地方使用.因此 Gatsby 无法推断类型并将其添加到 GraphQL 模式中.一种快速解决方法是添加至少一个包含该字段的条目(虚拟内容")2:51:25 AM:如果您想使用可选字段，建议明确键入您的 GraphQL 架构.这样您就不必添加提到的虚拟内容".访问我们的文档以了解如何为ContentfulArt"定义架构:https://www.gatsbyjs.org/docs/schema-customization/#creating-type-definitions

Gatsby-node.js 文件

在此处输入代码const path = require('path')module.exports.createPages = async ({graphql, actions}) =>{const { createPage } = 动作const 投资组合模板 = path.resolve('./src/templates/gallerylist.js')const { 数据 } = 等待 graphql(`询问{所有内容艺术{边{节点{标题标签发布日期(格式字符串:MMMM 做，YYYY")图片{文件{网址}}}}}}`)//错误处理//每页图像数量 = 8const imgPerPage = 8const numPages = Math.ceil(data.allContentfulArt.edges.length/imgPerPage)//我们通过edges.length从查询中的对象总数计算数学上限，然后将其除以8.//我们为Numpages中的每个索引创建页面，忽略带有_,"的回调，路径=我们将创建页面的路径//component - 包含我们创建页面代码端点的模板//context - 传递到创建页面的信息Array.from({length:numPages}).forEach((_, i) => {动作.createPage({路径:我 === 0 ?`/portfolio/${1}`:`/portfolio/${i + 1}`，组件:投资组合模板，语境: {限制:imgPerPage，跳过:我 * imgPerPage，数页，当前页面:i + 1}})})}

我的模板文件

从 'react' 导入 React从盖茨比"导入 {graphql}从'react-medium-image-zoom'导入缩放从'../components/footer'导入页脚从'../components/header'导入标题从'../components/head'导入头导入'react-medium-image-zoom/dist/styles.css'从'../components/pagination'导入分页从'../pages/portfolio.module.scss'导入投资组合样式const GalleryList = ({ pageContext, data}) =>{const {currentPage, numPages} = pageContextconst isFirst = currentPage === 1const isLast = currentPage === numPages/*如果prev page等于currentpage -1，我们返回返回第一页，否则我们向下一页*/const prevPage = currentPage - 1 === 1 ?`/portfolio/${1}` : `/portfolio/${currentPage - 1}`/*下一页=当前页+1*/const nextPage = `/portfolio/${currentPage + 1}`/* 这将返回一个包含画廊页面的 div 容器我们通过不同的预定义常量和变量传递数据*/返回 (<div className={portfolioStyles.maincontainergallery}><标题=画廊"/><div className={portfolioStyles.headercomponent}><标题/>{/* 包含菜单和分页的标题容器 */}<div className={portfolioStyles.portfoliopagepaginationcontainer}>{/* 这是分页组件，带有向下传递的道具来管理分页 */}<分页isFirst={isFirst}isLast={isLast}上一页={上一页}nextPage={nextPage}/>

There was an error in your GraphQL query: 2:51:25 AM: Cannot query field "tags" on type "ContentfulArt". 2:51:25 AM: If you don't expect "tags" to exist on the type "ContentfulArt" it is most likely a typo. However, if you expect "tags" to exist there are a couple of solutions to common problems: 2:51:25 AM: - If you added a new data source and/or changed something inside gatsby-node.js/gatsby-config.js, please try a restart of your development server 2:51:25 AM: - The field might be accessible in another subfield, please try your query in GraphiQL and use the GraphiQL explorer to see which fields you can query and what shape they have 2:51:25 AM: - You want to optionally use your field "tags" and right now it is not used anywhere. Therefore Gatsby can't infer the type and add it to the GraphQL schema. A quick fix is to add at least one entry with that field ("dummy content") 2:51:25 AM: It is recommended to explicitly type your GraphQL schema if you want to use optional fields. This way you don't have to add the mentioned "dummy content". Visit our docs to learn how you can define the schema for "ContentfulArt": https://www.gatsbyjs.org/docs/schema-customization/#creating-type-definitions

enter code here const path = require('path') module.exports.createPages = async ({graphql, actions}) => { const { createPage } = actions const portfolioTemplate = path.resolve('./src/templates/gallerylist.js') const { data } = await graphql( ` query{ allContentfulArt{ edges{ node{ title tags publishedDate(formatString:"MMMM Do, YYYY") image{ file{ url } } } } } } ` ) //error handling //amount of images per page = 8 const imgPerPage = 8 const numPages = Math.ceil(data.allContentfulArt.edges.length / imgPerPage) //we calculate math ceiling from the total amount of objects in our query by edges.length then divide it by 8. //we create page for each index in Numpages, ignoring the callback with "_,", path = path where we will create pages //component - template that contain the endpoints for our create page code //context - information to pass down into the created page Array.from({length:numPages}).forEach((_, i) => { actions.createPage({ path: i === 0 ? `/portfolio/${1}` : `/portfolio/${i + 1}`, component:portfolioTemplate, context: { limit: imgPerPage, skip: i * imgPerPage, numPages, currentPage: i + 1 } }) }) }

import React from 'react' import {graphql} from 'gatsby' import Zoom from 'react-medium-image-zoom' import Footer from '../components/footer' import Header from '../components/header' import Head from '../components/head' import 'react-medium-image-zoom/dist/styles.css' import Pagination from '../components/pagination' import portfolioStyles from '../pages/portfolio.module.scss' const GalleryList = ({ pageContext, data}) => { const {currentPage, numPages} = pageContext const isFirst = currentPage === 1 const isLast = currentPage === numPages /*if prev page equals to currentpage -1 we return return to the first page, otherwise we go down 1 page*/ const prevPage = currentPage - 1 === 1 ? `/portfolio/${1}` : `/portfolio/${currentPage - 1}` /*next page = currentpage + 1*/ const nextPage = `/portfolio/${currentPage + 1}` /* this will return a div container that conain gallery page we are passing data via different predefined constants and variables */ return ( <div className={portfolioStyles.maincontainergallery}> <Head title="Gallery" /> <div className={portfolioStyles.headercomponent}> <Header /> {/* Header container that includes menu and a pagination */} <div className={portfolioStyles.portfoliopagepaginationcontainer}> {/* This is pagination component with passed down props to manage the pagination */} <Pagination isFirst={isFirst} isLast={isLast} prevPage={prevPage} nextPage={nextPage}/> </div> </div> {/* This is a gallery div container that receives data from Graphql query*/} <div className={portfolioStyles.portfoliopagegallerycontainer}> <div className={portfolioStyles.portfoliopagegallery}> { data.allContentfulArt.edges.map((edge) => { return ( //we grabbing data from Contenful API using Graphql query //Zoom allows us to click-zoom the images passed down from Contenftul API <figure className={portfolioStyles.portfoliopagegalleryfigure} > <h3 > <figcaption> {edge.node.title} </figcaption> </h3> <p>{edge.node.tags}</p> <p>{edge.node.publishedDate}</p> <Zoom> <img src={edge.node.image.file.url} width="250" alt={edge.node.title}/> </Zoom> </figure> ) }) } </div> </div> {/* this is a footer container with a footer component */} <div className={portfolioStyles.portfoliopagefootercontainer}> <Footer /> </div> </div> ) } /* This is graphql query to grab the code from a Contentful API */ export const pageQuery = graphql` query($skip: Int!, $limit: Int!){ allContentfulArt(skip: $skip, limit: $limit){ edges{ node{ title tags publishedDate(formatString:"MMMM Do, YYYY") image{ file{ url } } } } } }` export default GalleryList

在类型