gatsby 相关问题

Gatsby - 冲突的对等依赖：使用 eslint-config-react-app 和 @typescript-eslint/eslint-plugin

我正在使用 gatsby (5.12.3)。我发现它依赖于 "@typescript-eslint/eslint-plugin": "^5.60.1" 和 "eslint-config-react-app": "^6.0.0", &q...

错误#98123 WEBPACK.BUILD-JAVASCRIPT 构建 gatsby 网站时生成 JavaScript 包失败

我一直在尝试构建我的盖茨比网站，但构建失败并出现错误，如下所示 构建生产 JavaScript 和 CSS 包失败 - 7.408s 错误 #98123 WEBPACK.BUILD-JAVASCRIPT 正在生成

GraphQL 就像 Next.js 中的 Gatsby

我的问题是有没有办法像 Gatsby 一样在 Next.js 中设置 Graphql。 这样我就可以查询页面并从中获取数据。 Next.js 是否有像 Gatsby-file-sour 这样的插件...

如何在gatsby/react中获取JSON-File的子节点

我想基于gatsby框架创建Azure Static Web App。我对 gatsby/react/javascript 开发很陌生。 我在 gatsby-node.js 文件中通过 axios 创建了一个 GET-Request。 常量 getBlogs =

Gatsby MDXRenderer：错误元素类型无效：需要字符串

我一直在使用 gatsby 开发一个简单的 wiki 风格的静态页面。 版本： “依赖项”：{ "@mdx-js/react": "^2.0.0", "盖茨比": "^5.13.2&q...

“gatsby build”在 Github Actions 上产生不同的结果

我正在尝试将 gatsby 构建和部署过程自动化到 git Push 上的 github 页面，但遇到了问题。 长话短说 在我的本地计算机（Windows 11）上使用yarn build（= gatsby build）构建网站...

如何将 /@{username} 格式的所有页面路由到模板页面？ - Gatsby.js

我刚刚使用 Gatsby.js 创建了一个网站，并希望我的用户能够通过在我的网站 URL 后面添加“@”符号并后跟他们的用户名来访问他们自己的个人资料页面（example.com/@

Facebook 的 OG 抓取工具使用的图像与我的 OG 标签中的图像不同

我正在使用 Gatsby 构建一个 React 应用程序，并使用 React Helmet 插件来插入元数据。我刚刚配置了所有开放图谱和 Twitter 标签，但它们没有使用我指定的图像。 对于

为什么 gatsby-plugin-image 缺少 image 属性？

编者注：这个问题对于大多数搜索 [gatsby-plugin-image] Missing image prop 错误的人来说可能没有帮助。作者在下面回答了他自己的问题 https://stackoverflow.com/a/

类型错误：使用 gatsby-image 时无法读取 null 的属性“childImageSharp”

我正在尝试使用 Gatsby 图像，但出现 Cannot read property 'childImageSharp' of null。我找不到错误在哪里。 Topsection.js 是一个底层组件。 image.jpg 位于 src/images/

类型错误：无法读取 null 的属性“childImageSharp”

我正在尝试使用 Gatsby 图像，但出现 Cannot read property 'childImageSharp' of null。我找不到错误在哪里。 Topsection.js 是一个底层组件。 image.jpg 位于 src/images/

如果在 Material UI 中选择了 FormControlLabel，如何设置它的背景颜色？

如果我有一个RadioGroup并且想要将选中的单选按钮的背景颜色设置为另一种颜色，我该如何在Material UI中执行此操作？在文档中找不到任何内容。 如果我有一个 RadioGroup 并且想要将选中的单选按钮的背景颜色设置为另一种颜色，我该如何在 Material UI 中执行此操作？在文档中找不到任何内容。 <FormControlLabel key={key} value={value} control={<Radio />} label={label} /> 如果我尝试下面的代码，只有单选按钮本身的背景颜色为黑色，而不是整个标签。 <FormControlLabel key={obj.value} value={obj.value} control={ <Radio sx={{ '&.Mui-checked': { backgroundColor: 'black', }, }} /> } label={obj.label} /> 实际上，我在文档中找到了一些有用的信息。 通过使用 useRadioGroup() 钩子，我们可以更好地控制单选组的外观。 受到文档中示例的启发，我找到了您问题的解决方案。 现场演示： 代码： import * as React from "react"; import RadioGroup, { useRadioGroup } from "@mui/material/RadioGroup"; import FormControlLabel, { FormControlLabelProps } from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; function MyFormControlLabel(props: FormControlLabelProps) { const radioGroup = useRadioGroup(); let checked = false; if (radioGroup) { checked = radioGroup.value === props.value; } if (checked) return ( <FormControlLabel sx={{ backgroundColor: (theme) => theme.palette.primary.light }} checked={checked} {...props} /> ); return <FormControlLabel checked={checked} {...props} />; } export default function UseRadioGroup() { return ( <RadioGroup name="use-radio-group" defaultValue="first"> <MyFormControlLabel value="first" label="First" control={<Radio />} /> <MyFormControlLabel value="second" label="Second" control={<Radio />} /> </RadioGroup> ); } 通过 Mui 示例文档和之前的答案进行一些调整，您可以通过更改您要引用的类来更改所选单选按钮的背景。 在 Mui Docs 示例中，他们通过引用 ".MuiFormControlLabel-label" 来更改文本的颜色 const StyledFormControlLabel = styled((props) => <FormControlLabel {...props} />)( ({ theme, checked }) => ({ '.MuiFormControlLabel-label': checked && { color: theme.palette.primary.main, }, }), ); 使用 "&.MuiFormControlLabel-root" 来访问背景和文本。 const StyledFormControlLabel = styled((props) => <FormControlLabel {...props} />)( ({ theme, checked }) => ({ '&.MuiFormControlLabel-root': checked && { //changing text color color: theme.palette.primary.main, //changing background color and shape backgroundColor: "#d3d3d3", borderRadius: "15px", }, }) ); 全面实施： import * as React from "react"; import { styled } from "@mui/material/styles"; import RadioGroup, { useRadioGroup } from "@mui/material/RadioGroup"; import FormControlLabel from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; constStyledFormControlLabel = styled((props) => <FormControlLabel {...props} />)( ({ theme, checked }) => ({ '&.MuiFormControlLabel-root': checked && { //changing text color color: theme.palette.primary.main, //changing background color and shape backgroundColor: "#d3d3d3", borderRadius: "15px", }, }) ); function MyFormControlLabel(props) { const radioGroup = useRadioGroup(); let checked = false; if (radioGroup) { checked = radioGroup.value === props.value; } return <StyledFormControlLabel checked={checked} {...props} />; } export default function UseRadioGroup() { return ( <RadioGroup name="use-radio-group" defaultValue="first"> <MyFormControlLabel value="first" label="First" control={<Radio />} /> <MyFormControlLabel value="second" label="Second" control={<Radio />} /> </RadioGroup> ); } 如果您在移动到另一个页面后保留 RadioGroup 的状态（例如用例：用户想要在多页面表单上回溯）。然后，此解决方案将在渲染时将您的自定义样式绑定到您的 RadioGroup 状态。

从 Gatsby 应用程序的多个页面读取和写入 Redux 存储

我的应用程序是这样的： 盖茨比计划 index.tsx - 应用程序的入口点 - 我调用 HomePage.js 使用 mapStateToProps 并使用 connect(

GraphQL 查询仅返回 3 项

我正在使用 GatsbyJS 开发一个网站，我使用了一个插件 gatsby-source-medium 来查询 media，这样我就可以获取帖子，无论我做什么，它总是返回 3 个项目。 我的查询： 查询 MyQuery {

Wordpress 盖茨比

我正在使用 Gatsby 和 Wordpress。我根据文档设置了一切。 但是当我进入 Graphql Query Explorer（可以生成 graphql 查询）时，没有与

Gatsby 构建失败，生成 SSR 包失败

当我在计算机上本地运行 Gatsby build 时，出现以下错误（请参阅日志）。看起来像是 webpack 错误。 盖茨比配置： /** * @type {import('gatsby').GatsbyConfig} */ 模块.导出...

将 objectFit 与 gatsby-plugin-image 中的 StaticImage 结合使用

我在网络应用程序中使用 gatsby-plugin-image 的 StaticImage 组件，但在将 objectFit 的属性从“cover”更改为“contain”时遇到问题。 这是我的代码示例： 从 '

Gatsby - EACCESS：“.config/gatsby”的权限被拒绝

我尝试在 VPS 服务器上安装 Gatsby，其中 ROOT 用户的“.config”文件夹不可写，不幸的是，就像它是托管 VPS 服务器一样，我无权访问 SUDO。 安装

Gatsby ENABLE_GATSBY_REFRESH_ENDPOINT 未按预期工作

我正在使用 Gatsby 构建前端，使用 WordPress 构建无头 CMS。当我对我的 WordPress 帖子进行更改时，我希望更改立即反映在我的 Gatsby 页面中。然而，当我做一个

使用strapi，如何在我的gatsby前端中显示markdownë

我使用strapi作为CMS，并返回“富文本markdown”字段， 我无法使用 gatsby 在我的前端格式化 markdown。 你有什么解决办法 ？谢谢 ！ 我尝试了诸如“r...