无法读取未定义的属性“ markdownRemark”(GatsbyJS)

时间:2020-09-03 02:39:40

标签: reactjs gatsby netlify

希望大家都安全在那里!在Netlify上部署生产GatsbyJS时遇到问题,问题是无法读取未定义的属性'markdownRemark',则生产失败。

Error on Netlify

整个分支实际上在正常的情况下在本地开发和构建生产时零错误,并且运行平稳,这就是为什么我们合并到主分支然后在最终分支上重新检查构建生产的原因,对此也没有任何问题。问题是,为什么?

这是代码:

import { Link, graphql } from "gatsby"
import { Disqus, CommentCount } from "gatsby-plugin-disqus"

import "../styles/index.scss"
import { slugify } from "../utils/utilityFunction"
import Layout from "../components/Layout"
import Sidebar from "../components/Sidebar"
import SEO from "../components/Seo"

export default function blogTemplate({ data, pageContext }) {
  const post = data.markdownRemark
  const { title, author, date, link, path, tags } = post.frontmatter
  const { shortenedLink } = pageContext

  // pas production mode, kalau disqusconfig nya sesuain sama production nya yaa~
  const disqusConfig = {
    // url: `himitsu.dev${path}`,
    title: title,
    identifier: path.split("/").slice(-1)[0],
  }

  return (
    <Layout>
      <SEO title={title} keyword={("Idols", "Music" + title)} />
      <div className="row mt-3">
        <div className="col-md-8">
          <div className="content-bar">
            <h1>{title}</h1>
            <p>
              Posted by {author} on {date} |{" "}
              <CommentCount config={disqusConfig} />
            </p>
            <div dangerouslySetInnerHTML={{ __html: post.html }} />
            {link.length > 0 && (
              <div className="card mx-auto mt-4" style={{ maxWidth: "600px" }}>
                <div className="card-header text-center">
                  Downloadable Content
                </div>
                {link.map((i, index) => {
                  return (
                    <li key={i.label} className="list-group-item text-center">
                      <span className="font-weight-bold mr-2">[{i.label}]</span>
                      <a
                        href={shortenedLink[index]}
                        target="_blank"
                        rel="noreferrer"
                      >
                        {shortenedLink[index]}
                      </a>
                    </li>
                  )
                })}
              </div>
            )}
            <div style={{ marginTop: "2rem" }}>
              Tags :{" "}
              {tags.map(tag => (
                <div className="mr-1 d-inline-flex" key={tag}>
                  <Link to={`/tag/${slugify(tag)}`}>
                    <span className="badge badge-secondary text-uppercase">
                      {tag}
                    </span>
                  </Link>
                </div>
              ))}
            </div>
            <div style={{ marginTop: "3rem" }}>
              <Disqus config={disqusConfig} />
            </div>
          </div>
        </div>
        <div className="col-md-4">
          <Sidebar />
        </div>
      </div>
    </Layout>
  )
}

export const blogQuery = graphql`
  query BlogPerPosts($path: String!) {
    markdownRemark(frontmatter: { path: { eq: $path } }) {
      frontmatter {
        author
        date
        title
        path
        tags
        link {
          label
          url
        }
      }
      html
    }
  }
`

对不起,我英语不好。

谢谢!

0 个答案:

没有答案