Reactjs 盖茨比没有生成正确的页面

我面临一个无法生成blog.js页面的问题

成功

• 我本可以把盖茨比和知足联系起来，从网上得到数据 主页(http://localhost:8000 )

失败

• 当我单击“阅读更多”按钮时，Card on（localhost:8000）和 切换到另一个页面（localhost:8000/博客/（我需要的内容） 已在contentful）上创建，但未成功，404页已 出现（唯一的熔渣已经改变，并且出现了我所期望的）

我的部分解决方案（但没有达到我希望的效果）

・Transferr文件（./src/templates/blog.js）→（./src/pages/blog.js）以这种方式显示页面(http://localhost:8000/blog)但我不知道为什么），bellow错误消失了，但无法获取数据（内容丰富）

错误

> warn The GraphQL query in the non-page component
> "C:/Users/taiga/Github/Gatsby-new-development-blog/my-blog/src/templates/blog.js"
> will not Exported queries are only executed for Page components. It's
> possible you're trying to create pages in your gatsby-node.js and
> that's failing for some reason.
> 
> If the failing component(s) is a regular component and not intended to
> be a page component, you generally want to use a <StaticQuery>
> (https://gatsbyjs.org/docs/static-query) instead of exporting a page
> query.

>警告非页面组件中的GraphQL查询
>“C:/Users/taiga/Github/Gatsby新开发博客/my blog/src/templates/blog.js”
>将不导出仅对页面组件执行的查询。它是
>可能您正试图在gatsby-node.js和
>这是失败的原因。
> 
>如果出现故障的部件是常规部件且不打算
>作为页面组件，您通常希望使用
> (https://gatsbyjs.org/docs/static-query)而不是导出页面
>询问。

下一个错误

> warn The GraphQL query in the non-page component
> "C:/Users/taiga/Github/Gatsby-new-development-blog/my-blog/src/templates/blog.js"
> will not Exported queries are only executed for Page components. It's
> possible you're trying to create pages in your gatsby-node.js and
> that's failing for some reason.
> 
> If the failing component(s) is a regular component and not intended to
> be a page component, you generally want to use a <StaticQuery>
> (https://gatsbyjs.org/docs/static-query) instead of exporting a page
> query.

• 无法读取未定义的属性“contentfulBlog”

根据您的，并且假设您已经取消了这些行的注释，您的“阅读更多”按钮与生成到所有t

ech.js

内容的路径之间存在不匹配

首先，澄清部分解决方案：它永远不会起作用，因为在你的

gatsby node.js

中，你告诉gatsby，all

contentfulBlog

的模板是确定的模板。您正在从检索到的数据生成每个页面，并在该模板中传递

id

（用于筛选）。由于您已将模板路径移动到页面文件夹，因此所有内容都无法正确传递，并成为未定义的

/blog/tech

未设置为您的

gatsby node.js

中的任何位置的路径。你有：

path: i === 0 ? `/category/tech` : `/category/tech/${i + 1}`,

因此，如果您的“阅读更多”链接指向

/blog/path

，它将始终失败，因为可以正确获取该内容，但它从未设置为该路径

您需要修复这些路径以满足您的需求。您可以将您的

gatsby node.js

路径更改为：

path: i === 0 ? `/blog/tech` : `/blog/tech/${i + 1}`,

或者更改“阅读更多”按钮