错误为路径“/post/combiningmarriagewithlove”构建静态 HTML 失败 - 降价帖子

问题描述

我在运行 gatsby build 时收到此错误消息。我的帖子是我使用 GraphQL 获取的 Markdown 文件。我不明白有什么问题。

2:18:43 PM: error Building static HTML Failed for path "/post/combiningmarriagewithlove"
2:18:43 PM: 
2:18:43 PM: 
2:18:43 PM:   Error: Minified React error #130; visit https://reactjs.org/docs/error-decoder  .html?invariant=130&args[]=undefined&args[]= for the full message or use the n  on-minified dev environment for full errors and additional helpful warnings.

package.json：

    "@fortawesome/fontawesome-svg-core": "^1.2.32","@fortawesome/free-brands-svg-icons": "^5.15.1","@fortawesome/free-solid-svg-icons": "^5.15.1","@fortawesome/react-fontawesome": "^0.1.13","gatsby": "^2.26.1","gatsby-image": "^2.7.0","gatsby-plugin-fontawesome-css": "^1.0.0","gatsby-plugin-sharp": "^2.10.0","gatsby-remark-images": "^3.7.0","gatsby-remark-relative-images": "^2.0.2","gatsby-source-filesystem": "^2.6.1","gatsby-transformer-remark": "^2.12.0","gatsby-transformer-sharp": "^2.8.0","react": "^16.12.0","react-dom": "^16.12.0","react-scroll": "^1.8.1","react-spring": "^8.0.27","react-three-fiber": "^5.3.7","three": "^0.123.0"
  },"devDependencies": {
    "env-cmd": "^10.1.0","prettier": "2.1.2"
  },

md 文件：

---
id: "5"
title: "Combining Marriage with love"
name: "Surbhi"
date: "2020-01-01"
details: "INTERVIEW and PHOTOGRAPHY by Riin Raanu"
featuredImage: "../images/surbhi.jpeg"
---

India – vibrant,diverse and loud – never stops challenging my perspectives. Like when I realized that an arranged marriage in India is just called marriage,whereas a self-choice marriage is called love ...

解决方法

你试过了吗：

const { createFilePath } = require(`gatsby-source-filesystem`)

exports.onCreateNode = ({node,actions}) => {
    const { createNodeField } = actions

    if(node.internal.type === "MarkdownRemark") {
       const slug = createFilePath({ node,getNode,basePath: `pages` })
        
        createNodeField ({
            node,name: 'slug',value: slug
        })
    }
}

exports.createPages = async ({ graphql,actions}) => {
    const { createPage } = actions 
    const postTemplate = path.resolve('./src/templates/post.js')
    const res = await graphql(`
    query {
        allMarkdownRemark {
            edges {
                node {
                    fields {
                        slug
                    }
                }
            }
        }
    }
    `).then(res =>{
        if (res.rrors){
            return Promise.reject(res.errors)
        }
    res.data.allMarkdownRemark.edges.forEach((edge) => {
        createPage({
            component: postTemplate,path: `/post/${edge.node.fields.slug}`,context: {
                slug: edge.node.fields.slug
            }
        })
    })
})
}

在删除 module 的同时，我添加了一个基于 new docs 的新 slug 创建解析器。在再次构建网站之前运行 gatsby clean。