Gatsby构建生产类型未定义的错误

Question

尝试为gatsby构建产品时出现错误，但是在开发中，我的网站运行没有问题。我正在使用Material UI，它在我使用库的区域上令人窒息。即使当我注释掉那些东西时，在诸如将道具从父母传递到孩子的区域上，我也会遇到其他类型的未定义错误。

运行gatsby构建时，我得到：

  

无法为页面构建静态HTML-6.444s

     

错误＃95313

     

为路径“ / 404 /”构建静态HTML失败

     

有关此错误的更多信息，请参见我们的文档页面：   https://gatsby.dev/debug-html

     

15 | }，16 | activeLink：{

     

    

17 |颜色：${theme.link.active} !important，          | ^ 18 | }，19 | linkLogo：{20 |高度：“ 100％”，

  

     

WebpackError：TypeError：无法读取未定义的属性“ active”

这是我的代码的一部分，在构建期间遇到错误。不能滥用，因为在开发中它是有效的。

const useStyles = makeStyles(theme => ({
appBar: {
 backgroundColor: "transparent",
 position: "relative",
 boxShadow: "none",
 marginBottom: props => props.data.headerMb,
},
activeLink: {
 color: `${theme.link.active} !important`,
},
}))

即使我注释掉那一部分，仅在gatsby build期间将道具传递给子组件时，我也会得到简单的类型不确定的错误。坦白地说，为什么我每次评论时都会出现这么多类型错误。

Answer 1

原来，这是一个404.js页面，使用的组件需要我没有传递的道具。不确定为什么在构建过程中它没有告诉我，但是抱怨其他页面。 因此，请确保是否有未使用的页面来删除它们，或者它们是否包含所需的所有道具。

Answer 2

似乎theme.link不存在，这就是为什么您遇到此错误。您可能要在其中使用默认值，然后执行以下操作：

activeLink: {
  color: `${theme.link ? theme.link.active : 'your-default-color'} !important`
}