CODEWITHSUNDEEP
reactjsgraphqlgatsbycontentful
Taiga
Taiga

Reputation: 165

Gatsby not generate correct page

I'm facing a problem that could not generate a blog.js page.

Success

fail

My repo

My partial solution (but not working that I hoped to)

・Transfrer file (./src/templates/blog.js)→(./src/pages/blog.js) in this way that could've shown up the page (http://localhost:8000/blog) but I don't know why ) and bellow the error was disappear but could have not fetched the data(contentful).

Error

> 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.

Next error

Upvotes: 0

Views: 663

Answers (1)

Ferran Buireu
Ferran Buireu

Reputation: 29320

According to your gatsby-node.js, and assuming you've uncommented those lines, you have a mismatch between your "Read more" button and the path generated to all tech.js content.

First of all, to clarify your partial solution: it will never work because in your gatsby-node.js you are telling Gatsby that the template for all contentfulBlog is certain template. You are generating each page from the retrieved data and passing the id (to filter) in that template. Since you've moved the template path to a page folder, all that content is not passed properly and became undefined.

/blog/tech is not set as path anywhere in your gatsby-node.js. You have:

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

So, if your "Read more" links to /blog/path it will always fail since that content may be fetched properly, but it's never set to that path.

You need to fix those paths to fit your requirements. You can change your gatsby-node.js path to:

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

Or changing your "Read more" button.

Upvotes: 1

Related Questions