标签: gatsby

我正在学习 gatsby 和 contentful 来构建一个网站，但是当我从 Contentful 查询数据时，它会显示相同的内容两次，如下所示。可能是什么原因？

我对此感到非常烦恼，我明白这个错误意味着什么，但就是无法深入了解它。

{headerStyles.title} 不断引发此 TypeError。据我所知，我的所有模块语法都是正确的。

header.js

import headerStyles from "./header.module.scss"

return (
    <div className={headerStyles.header}>
      <h1>
        <Link className={headerStyles.title} to="/">
          {data.site.siteMetaData.title}
        </Link>
      </h1>
    </div>
)

标头.模块.scss

.title {
  color: black;
  font-size: 3rem;
  text-decoration: none;
}

由于我的声誉较低，我无法发表评论，因此我添加了这个问题，以便我可以设定自己的答案。我希望这可以为其他开发人员解决问题。

我收到此错误：dyld: lazy symbol binding failed: Symbol not found: _node_module_register Gatsby realated 我正在使用 Gatsbyjs。尝试运行开发时出现错误。基本上在这种情况下，这是因为我后来添加了插件：“gatsby-plugin-manifest”。我相信问题是因为这个插件清单使用的一些依赖项也被另一个插件使用：“gatsby-plugin-sharp”。他们都可以将网站图标设置为网页。所以我的解决方案是：

• 只需运行 -> 即可重新安装插件“gatsby-plugin-sharp”npm install --save gatsby-plugin-sharp

通过这样做，现在我能够运行了npm run develop。

为什么要发布此内容 基本上我们知道一个特定的问题可能与许多事情相关。这就是为什么我针对这个特定问题发布了这个解决方案。其他一些解决方案讲述了删除 node_modules 文件夹并再次运行npm install以安装 package.json 中引用的所有模块，但就我而言，我想尝试另一个解决方案，因为我正在使用的一些插件不需要它们更新

希望这对其他人有帮助。

我的应用程序是这样的：

盖茨比计划

index.tsx - 应用程序的入口点 - 我调用

<Provider store={store}>
   <HomePage />
</Provider>

HomePage.js 用途mapStateToProps与用途connect(mapStateToProps)(HomePage)

当然，在我的主页中，我使用了多个 React 组件。我可以利用该商店，读取/写入该商店上发生的任何事情HomePage。

在我的主页上，我有指向 的链接ActivityPage。一旦我点击此页面并登陆那里 - 问题就开始了。

ActivityPage 使用多个子组件来完成任务。如何从 ActivityPage 访问读/写？

我无法useDispatch在商店中写入甚至读取。我可以在我的 ReactDev 工具上看到该商店，但在尝试读/写时，我收到 11 个错误，大部分是沿着我需要用以下内容包装组件的思路：<Provider>

我在 Stack Overflow 上阅读了不同的解决方案，这表明我需要拥有mapStateToProps并使用connect需要访问商店的任何组件。

这是行不通的，因为我特别希望从“新页面”访问商店。我需要为我的子页面创建另一家商店吗？请帮助。 :

切换到 gatsby-plugin-image 后，CSS 边框半径在 Safari 中不起作用

在我的笔记本电脑上，我可以看到图像的边框半径，但它似乎不适用于 iPhone 或 iPad。（即图像仅在 iPhone / iPad 上是方形的，我没有看到 border-radius:25px 应用于图像）

编辑11-24：抱歉，这是我正在使用样式组件的代码片段

export const MyImageContainer = styled(GatsbyImage)`
  cursor: pointer;
  border-radius: 25px;
`

Material-ui 的 Card 组件可以有一个 CardMedia 组件作为子组件，它接受图像源作为 prop。另一方面，盖茨比图像需要它自己的源作为道具（固定或流动）。

<Card>
  <CardHeader title={title}/>
  <CardMedia src={image.localFile.childImageSharp.fixed} component={Img} /> 
</Card>

这个问题有什么解决方法吗？