gatsby 相关问题

Gatsby是React的现代网站生成器。它专注于性能和灵活的数据源。

如何在 Gatsby-plugin-image 中将图像路径作为 Gatsby 中的 prop 传递

我正在尝试将图像的路径作为道具传递给组件 注意:组件和索引页都可以通过相同的路径访问图像。当我将路径作为 p 传递时它不起作用...

回答 3 投票 0

Netlify“build.command”对于 gatsby 网站失败

我最近在我的 Gatsby 网站上更新了一些插件。它在本地工作正常,但在 Netlify 上部署失败。 我收到的错误是: “build.command”失败 - 命令被终止

回答 3 投票 0

在使用 React Three Fiber 的 Gatsby 应用程序中使用 Context 实例化网格时出错

在我的 gatsby 应用程序中,我尝试利用实例多次显示网格。为此,我使用 https://gltf.pmnd.rs/ 提供的以下代码: 导入 React, { useRef, useMemo, useContext,

回答 1 投票 0

如何修复 gatsby 中的链接 url 未定义错误?

我正在尝试使用 Gatsby 从解析到的数据自动生成页面,并在 url 生成中不断收到错误。如果我手动将它们输入浏览器,则数据很好,因为页面可以工作...

回答 0 投票 0

ModuleNotFoundError:找不到模块:错误:无法解析“/home/pegasus/Documents/Final_Website/blog/node_modules/pdfjs-dist/build”中的“canvas”

当我安装react-pdf时,出现以下错误: ModuleNotFoundError:找不到模块:错误:无法解析“/home/pegasus/Documents/Final_Website/blog/node_modules/pdfjs-dist/bui...”中的“canvas”...

回答 1 投票 0

避免在所有状态更改时发生反应组件重新渲染

我的组件有2个状态。第一个状态在用户交互时更新,然后使用 useEffect() 挂钩触发第二个状态的更新。这导致...

回答 1 投票 0

使用 gatsby js 时出现与 CSS commons 相关的奇怪错误

正如标题所示,我得到了一个非常奇怪的错误代码,它几乎没有描述错误本身(如下所示) 我收到的错误消息 我无法真正找出罪魁祸首,但我怀疑它有一些......

回答 2 投票 0

页面更改时外部脚本未加载

我正在尝试将 Trustpilot 小部件添加到我的 Gatsby.js 网站。需要从 Trustpilot CDN 加载外部脚本。 <p>我正在尝试将 Trustpilot 小部件添加到我的 Gatsby.js 网站。需要从 Trustpilot CDN 加载外部脚本。</p> <pre><code>&lt;script type=&#34;text/javascript&#34; src=&#34;//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js&#34; async&gt;&lt;/script&gt; </code></pre> <p>我尝试了多种方法将此脚本添加到我的组件中。我尝试的第一件事是 React Helmet。我使用以下代码添加:</p> <pre><code>&lt;Helmet&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js&#34; async&gt;&lt;/script&gt; </code></pre> <p>当我最初加载页面时,脚本似乎会加载。一旦我导航到不同的页面,样式就会消失。当我重新加载时,它又回来了。</p> <p>我尝试在 componentDidMount() 中添加脚本</p> <pre><code>componentDidMount() { var addScript = document.createElement(&#39;script&#39;); addScript.setAttribute(&#39;src&#39;, &#39;//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js&#39;); document.body.appendChild(addScript); } </code></pre> </question> <answer tick="false" vote="0"> <p>如果您希望脚本(或任何其他组件)在您的站点中持久存在,则需要使用 <pre><code>wrapPageElement</code></pre> 或 <pre><code>wrapRootElement</code></pre> API。建议将这两个 API 放置在 <pre><code>gatsby-browser.js</code></pre> 以及 <pre><code>gatsby-ssr.js</code></pre></p> 中 <p><em>免责声明:每次加载 DOM 树时都会触发 <pre><code>componentDidMount()</code></pre>,它不适用于您的用例。</em></p> <p>这里的问题是您添加的是非 React 资产,而不是组件。你可以尝试:</p> <pre><code>export const wrapPageElement = ({ element, props }) =&gt; { return &lt;SomeWrapper {...props}&gt;{element}&lt;/SomeWrapper&gt;; }; </code></pre> <p>然后,创建一个名为 <pre><code>SomeWrapper</code></pre> 的组件并放置您的 <pre><code>&lt;Helmet&gt;</code></pre>:</p> <pre><code>const SomeWrapper = (props) =&gt;{ return &lt;div&gt; &lt;Helmet&gt; &lt;script type=&#34;text/javascript&#34; src=&#34;//widget.trustpilot.com/bootstrap/v5/tp.widget.bootstrap.min.js&#34; async /&gt; &lt;/Helmet&gt; {props.children} &lt;/div&gt; } </code></pre> </answer> <answer tick="false" vote="0"> <p>我在基于反应的网站上遇到了这个问题。 Trustpilot 对于如何处理基于类和钩子的 React 项目有具体说明。一旦我实现了这一点,它就为我解决了问题。</p> <p>以下是说明链接: <a href="https://support.trustpilot.com/hc/en-us/articles/115011421468--Add-a-TrustBox-widget-to-a-single-page-application#add-a-trustbox-widget-with-a-react-application-1" rel="nofollow noreferrer">https://support.trustpilot.com/hc/en-us/articles/115011421468--Add-a-TrustBox-widget-to-a-single-page-application#add-a-trustbox-widget-with- a-react-application-1</a></p> <p>我会添加他们的 React 说明,但我不知道这样做是否是文案,所以只需检查 pg。</p> </answer> </body></html>

回答 0 投票 0

./src/templates/project-details.js 中的 ProjectDetails 函数出错:7

==无聊,但可能必要的环境条件== NetNinja 在 YouTube 上提供的 Gatsby 教程在网络上非常受欢迎,我到处都能看到对代码的逐字引用。为了...

回答 1 投票 0

Contentful Rich Text 从 Gatsby 和 GraphQL 接收的节点对象中没有引用字段

我正在使用 Gatsby 5 和 contentful/rich-text-react-renderer。 我有一个 ContentfulPost 类型,它有一些指向富文本中相关类型的链接。 我正在关注文档(来自 Gatsby 和 Contentfu...

回答 1 投票 0

(Gatsby) 在 MDX 组件中显示 frontmatter 数据

我正在尝试创建一个简单的署名组件,以在我的 MDX 帖子中使用,该组件使用 href="mailto:[email protected]" 和一个带有帖子发布日期的时间标签来显示网站作者。 .

回答 2 投票 0

在 git 存储库中为团队成员和自由职业者隐藏/限制部分源代码

我查看了许多相关/类似的问题,但找不到任何足够的答案来回答我的问题。 我有一个 Gatsby/React 项目,我有一个私有 git 存储库,托管在

回答 1 投票 0

Gatsby 不渲染 MDX,而是提供纯文本

我正在用 Gatsby 构建一个博客,我已经取得了一些进展,但是当我尝试在我的博客模板中渲染 mdx 时,它不会渲染任何内容。 我使用 createPages api,一切正常,例如...

回答 2 投票 0

Sanity 环境变量

嗨,我目前正在尝试在 sanity 文件夹中设置一个 sanity 环境变量。 根据理智文档,它说使用 process.env.SANITY_STUDIO_VARIABLE_NAME 但看起来它...

回答 0 投票 0

您可能需要适当的加载程序来处理此文件类型,目前没有配置加载程序来处理此文件。请参阅 https://webpack.js.org/

当我尝试构建 gatsby 构建时出现此错误 编译 Gatsby 函数失败 - 6.195 秒 无法验证错误[错误[ValidationError]:“错误”必须是对象类型] { _原创...

回答 0 投票 0

渲染MDX时如何减少Gatsby中的___chunkMapping?

现在我有大约 50 页,每页都有 4 种语言的翻译。 我以编程方式创建页面。根据文档,我必须以这种形式为每个页面指定一个组件的路径...

回答 0 投票 0

GatsbyJS 和 graphql - 无法读取未定义的属性(读取“mdx”)

我有以下文件夹结构: 页面 索引.js about.js 档案 索引.js docu-{mdx.frontmatter__key}-{mdx.frontmatter__slug}.js 成分 单个文档部分 概述 概述.js 工业...

回答 0 投票 0

Gatsby 中的多个查询错误“发现多个“根”查询”

通过本教程创建帖子模板(我在第 4 部分): https://www.joaopedro.cc/blog-com-gatsby-e-react-parte-4 但是在执行“PostPage”查询时发生错误: 多...

回答 5 投票 0

Gatsby 打字稿 css 模块和 vitest

Gatsby 5 要求您将 css 模块导入为导出成员或 * 作为 import * as styles from ‘./index.module.css’ 这一切在前端都运行良好并按预期显示,但是当 ...

回答 0 投票 0

将降价文件访问到 gatsby 中的组件

我希望将 .md 文件中的内容包含到 gatsby 的组件中,但不确定查询应该是什么(发现这非常令人困惑)。 盖茨比-config.js [ { 解析:`gatsby-source-

回答 0 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.