#reactjs #gatsby #netlify-cms
#reactjs #gatsby #netlify-cms
Вопрос:
В нем говорится, что path равен null, а context> slug равен null. Однако они определены в моем gatsby-node.js досье.
Он работал локально, теперь это не так. Пытаюсь выяснить, почему это происходит. Поиск в Google и S / O, похоже, не может найти ответа.
Вот ошибка ниже при развертывании в Netlify:
10:51:57 AM: error Your site's "gatsby-node.js" must set the page path when creating a page.
10:51:57 AM: The page object passed to createPage:
10:51:57 AM: {
10:51:57 AM: "path": null,
10:51:57 AM: "component": "/opt/build/repo/src/templates/blogTemplate.js",
10:51:57 AM: "context": {
10:51:57 AM: "slug": null
10:51:57 AM: }
10:51:57 AM: }
Моя уценка в файлах моих сообщений в блоге:
---
title: example
slug: /posts/example/
date: 2019-03-26T23:53:24.128Z
excerpt: >-
example description
---
Мой gatsby-node.js:
exports.createPages = async ({ actions, graphql, reporter }) => {
const { createPage } = actions
const blogPostTemplate = require.resolve(`./src/templates/blogTemplate.js`)
const result = await graphql(`
{
allMarkdownRemark(
sort: { order: DESC, fields: [frontmatter___date] }
limit: 1000
) {
edges {
node {
frontmatter {
slug
}
}
}
}
}
`)
// Handle errors
if (result.errors) {
reporter.panicOnBuild(`Error while running GraphQL query.`)
return
}
result.data.allMarkdownRemark.edges.forEach(({ node }) => {
createPage({
path: node.frontmatter.slug,
component: blogPostTemplate,
context: {
// additional data can be passed via context
slug: node.frontmatter.slug,
},
})
})
}
Мой blogTemplate.js файл:
import React from "react"
import { Container, Row, Col } from "reactstrap"
import { Helmet } from "react-helmet"
import Nav from "../../components/Nav/nav"
import InnerHero from "../../components/innerHero/innerHero"
import CTA from "../../components/CTA/cta"
import Footer from "../../components/Footer/footer"
import { graphql } from "gatsby"
export default function Template({
data, // this prop will be injected by the GraphQL query below.
}) {
const { markdownRemark } = data // data.markdownRemark holds your post data
const { frontmatter, html } = markdownRemark
return (
<>
<Helmet>
<title>{frontmatter.title} - Infused</title>
<meta
name="description"
content={frontmatter.excerpt}
/>
</Helmet>
<Nav/>
<InnerHero title={frontmatter.title}/>
<section className="inner-content">
<Container className="single-blog">
<Row>
<Col lg="12">
<div className="blog-post">
<div
className="blog-post-content"
dangerouslySetInnerHTML={{ __html: html }}
/>
</div>
</Col>
</Row>
</Container>
</section>
<CTA/>
<Footer/>
</>
)
}
export const pageQuery = graphql`
query($slug: String!) {
markdownRemark(frontmatter: { slug: { eq: $slug } }) {
html
frontmatter {
date(formatString: "MMMM DD, YYYY")
slug
title
excerpt
}
}
}
`
Комментарии:
1. После некоторого чтения кажется, что проблема с кэшем Netlify связана с несоответствием версии зависимостей. Попробуйте обновить свои зависимости и создать свой сайт локально, чтобы проверить, сможете ли вы воспроизвести проблему на своем компьютере.
2. @FerranBuireu попытался удалить node_modules, переустановить node_modules и по-прежнему получать ту же ошибку.
3. Какая версия узла работает как на вашем локальном, так и на Netlify?