Гэтсби JS происходит `Не удается прочитать свойство 'frontmatter' из null`, когда я пытался собрать - PullRequest
3 голосов
/ 15 января 2020

Я пытаюсь построить свое новое приложение Gatsby JS.

Это приложение хорошо работает, когда я пытаюсь разработать gatsby .

Но когда я попробовал для сборки, Builder не может найти вариант frontmatter.

Похоже, что у GraphQL нет проблем, потому что я могу проверить содержимое уценки в журнале.

Что не так в моем коде?

gatsby-config. js

...

plugins: [
    {
      resolve: "gatsby-source-filesystem",
      options: {
        path: `${__dirname}/src/articles`,
        name: "articles",
      },
    },

...

src / pages / markdown-template. js

import React from "react"
import { graphql } from "gatsby"

import Layout from "../components/layout"
import CustomCard from "../components/ui/customcard"
import "./markdown-template.css"

export default function Template({ data }) {
  console.log(data.markdownRemark)
  const frontmatter = data.markdownRemark.frontmatter
  const html = data.markdownRemark.html
  const tags = frontmatter.tags

  return (
    <Layout>
      <CustomCard>
        <div className="article">
          <h1>{frontmatter.title}</h1>
          <h2>{frontmatter.updated}</h2>
          <div className="tags-container">
            <div className="tags">
              {tags.map(tag => {
                return <span className="tag">{tag}</span>
              })}
            </div>
          </div>
          <hr />
          <div
            className="article-body"
            dangerouslySetInnerHTML={{ __html: html }}
          />
        </div>
      </CustomCard>
    </Layout>
  )
}

export const pageQuery = graphql`
  query($path: String!) {
    markdownRemark(frontmatter: { path: { eq: $path } }) {
      html
      frontmatter {
        created(formatString: "YYYY-MM-DD")
        updated(formatString: "YYYY-MM-DD")
        path
        title
        tags
        category
        language
      }
    }
  }
`

Вывод на консоль при попытке запустить сборку gatsby

...

success Building production JavaScript and CSS bundles - 9.682s
success Rewriting compilation hashes - 0.005s
success run queries - 9.978s - 10/10 1.00/s
[                            ]   0.001 s 0/7 0% Building static HTML for pages
{
  html: '<p>asdf</p>\n<h1>test</h1>',
  frontmatter: {
    created: '2020-01-10',
    updated: '2010-01-10',
    path: '/article/hello',
    title: 'Hello Gatsby',
    tags: [ 'Hello', 'World' ],
    category: 'test',
    language: 'ko'
  }
}
failed Building static HTML for pages - 1.742s

 ERROR #95313 

Building static HTML failed for path "/markdown-template/"

See our docs page for more info on this error: https://gatsby.dev/debug-html


   8 | export default function Template({ data }) {
   9 |   console.log(data.markdownRemark)
> 10 |   const frontmatter = data.markdownRemark.frontmatter
     |                                           ^
  11 |   const html = data.markdownRemark.html
  12 |   const tags = frontmatter.tags
  13 | 


  WebpackError: TypeError: Cannot read property 'frontmatter' of null

  - markdown-template.js:10 Template
    src/pages/markdown-template.js:10:43

...
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...