2

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

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.

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

2 回答 2

0

你有没有尝试过：

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，我添加了一个基于新文档的新 slug 创建解析器。gatsby clean在再次构建站点之前运行。

于 2021-02-08T07:55:01.067 回答
0

我遇到了同样的错误，我能够修复它的方法是将我的一个样式组件更改为正确的反应样式

style={{maxWidth: "540px"}}

（之前是这样的：）

style="max-width: 540px;"

这不是我的 linter (ESLint) 发现的，但如果你没有 linter，安装一个可能会有所帮助，它可能会突出问题

于 2022-01-24T19:09:38.820 回答