我正在使用Gatsby JS基于同一模板生成一个包含数千个页面的站点。为了生成所有这些页面,我对外部服务进行了一些调用,以获取填充这些页面的数据
我的问题是,有时这些调用会失败,但可能只有1500页中的一页
是否可以中止生成失败的特定页面,使其不会生成,并且我可以安全地重新部署其他页面,而不覆盖失败的页面
我试过使用,但运气不好 这是我以前回答过的一个问题
是否可以中止生成失败的特定页面,使其不生成
对。您可以在gatsby node.js中执行此操作:
const path=require(`
我有一个导航栏菜单,其中有几个菜单项,在盖茨比的一个使用Reactstrap的站点中。菜单项设置为指向该页面内的锚定标记(例如,#anchor1)
锚1
主播2
虽然链接工作正常,但菜单项不会显示为活动状态:未将active类添加到NavItem。如何在用户导航到菜单项时突出显示这些菜单项?来自:
无论是还是“导航”都不能用于带有
散列或查询参数。如果你需要这种行为,你应该
使用锚定标签或导入Gatsby提供的@reach/router包
已依赖于利用其导航功能
由于这种不相容性,我猜你的错
我正在使用gatsby插件清单,将图标设置为一个图标,这对于Android和iOS设备来说非常好。但现在我想定义一个用于浏览器的附加图标(大小为32x32像素,文本更少)。但是我想保留其他图标
可能吗?如果是,如何处理满足您需求的一系列选项:
// in gatsby-config.js
module.exports = {
plugins: [
{
resolve: `gatsby-plugin-manifest`,
options: {
n
我刚接触盖茨比形象公司
我从gatsby/examples/使用gatsby image/src/pages/获得了示例示例站点,它使用gatsby develope在本地工作
接下来有两个步骤:
将Img(和graphql查询)分离到另一个组件,并从blur-up.js中调用该组件-为什么?因为Img和graphql是冗长的,并且与我当前使用的样式化组件(它是内联的)不匹配。。。它允许进行下一步(步骤2)
一旦它作为一个组件运行,那么父级可以向它传递一些简单的道具(文件名、大小)。这意味着任何
我对GatsbyJS是新手,一直在梳理文档寻找解决方案,但似乎找不到,这让我觉得我缺少了一些更大的内容。我认为消除浏览器默认样式的方法是在我的索引布局中导入某种类型的css reset.css文件,并用我自己的样式覆盖它,大致如下:
import React from 'react';
import reset from './reset.module.css';
import styles from './index.module.css';
但我似乎无法以这种方式覆盖它们(只实现了重置)
我喜欢盖茨比提供的所有优化,但我想在获取图像时有更多的控制权。我怎样才能做到这一点
举个例子,想想一个典型的博客:很多页面,很多文本,很少图片
《盖茨比》中的默认行为是,当您滚动到图像时,图像会被延迟加载,并带有占位符,然后转到任何媒体博客以查看其外观。我不喜欢这个。如果我在30秒前加载页面,那么已经有足够的时间向我发送图像了。没有必要给我看一张模糊的照片,我现在应该有真实的图像了
如何改变这种行为?我在中发现的唯一一件事是,我可以将我的图像标记为关键图像,以便它们立即开始加载。将我的所有图像标
我想看看是否有一个基本的组件作为盖茨比主题是可行的,并使用这个主题作为我的盖茨比项目的基础,所以在新项目中,我会跟踪我想要调整的组件
我的问题是我可以阴影部分的组成部分
例如:
import React from "react";
import { ThemeProvider } from "styled-components";
import theme from "./theme";
import {
TeaserContainer,
ImageContainer,
我能够成功地将盖茨比源谷歌地图静态插件连接到我的项目中,但我正在寻找一个多地图解决方案,而不是单一地图
有没有办法在gatsby-config.js文件之外与插件交互
gatsby-config.js插件设置
{
解析:`gatsby source googlemaps static`,
选项:{
key:`googlemapsapi key`,
中锋:丹佛,科罗拉多州`
}
}
2020年3月30日(),盖茨比源代码googlemaps static插件已扩展以响应此功能请求
现在,您可以使用
标签: Gatsby
postcsstailwind-css
我在《盖茨比》中使用了自托管字体,效果很好。基本上我有-
一个fonts/文件夹,其中放置了所有.woff2文件,以及一个fonts.css,其中包含所有@font-face调用(这种方式是因为几乎有15个@font-face调用)
我在gatsby config.js中配置了gatsby源文件系统插件,如下所示
我现在已经安装了带有POSTSS的尾灯,如下所示-
使用纱线安装了tailwindcss和gatsby插件postsss
配置的gatsby config.js如下-
将尾风
标签: Gatsby
gatsby-imagegatsby-plugin
每次我试图安装盖茨比图像插件时都会出现这个错误。也试过盖茨比干净的毛线。试过不同版本的盖茨比,但也没用
您能提供更多详细信息吗?平台、版本、操作系统等
我正在尝试使用创建youtube编辑器组件。我用的是盖茨比、Netlify CMS和Netlify。我想在Netlify CMS的预览中预览视频(可以是视频本身或图像)。然而,这会导致冲突。如果它在Netlify CMS中起作用,它对盖茨比不起作用,反之亦然
gatsby remark embed video依赖模式youtube:ID嵌入视频,该模式在gatsby上正常工作。问题是,当使用Netlify CMS时,它将解析youtube:ID作为标记代码,因为通常我们使用Backtick(严重
Gatsby是否可以配置为在现有站点上自己的文件夹内运行,并从该Gatsby文件夹外的文件夹中提取页面数据
例如,作为现有应用程序上的帮助和支持区域,其中现有代码库包括将作为静态帮助和支持网站内容的readme.md文件。您可以将gatsby放在子域中,例如:。盖茨比将在这个子域中做自己的事情。看一看
您可以从Gatsby文件夹外部将页面数据定义为数据源。您需要以某种方式公开readme.md文件。这是能帮你解决这个问题的方法
一些让盖茨比变得伟大的内部构件在与主站点的连接中不起作用。我想到了
在盖茨比,使用Algolia,我可以让文本搜索正常工作,搜索结果正确链接到他们的博客文章
每个博客帖子都有一个页脚。在此页脚中有关键字。是否可以单击一个关键字,然后将其发送到一个结果页面,其中包含所有具有相同关键字的匹配博客帖子?您可以将标签或关键字作为frontmatter的一部分。然后在algolia查询中,将frontmatter中的字段包含在GraphQL查询中,它将能够基于这些标记进行搜索
我已经为我的盖茨比网站添加了一个画廊。在MP4和GIF上效果很好,但是当物品是盖茨比图像时,它没有高度
我可以在盖茨比图像包装器上设置一个高度:500px,位置:static,和img{object fit:contain},但比例奇怪
我认为这是因为盖茨比图像中渲染的img是position:absolute和object-fit:cover,所以砖石钩不知道它的大小,但我太初学了,无法理解
砌体项目中的盖茨比图像如下所示:
<div class=" gatsby-image-wrapp
我想用两种方式将我的每个盖茨比页面呈现为HTML
1) 没有来自html.js的任何包装内容
2) 使用html.js中的任何内容,无论是使用默认版本还是我在repo中编写的自定义版本
这允许我将来自不同存储库(共享相同html.js的不同团队)的客户端页面缝合在一起
这相当于我用两个不同的html.js文件呈现每个页面,一个包含内容,一个空白
这有可能控制吗?我在盖茨比文档中找不到任何用于此的API。我认为html.js是页面的布局组件我认为这不完全正确。你能不能再多加一点关于你的动机和你想要
我们正在建设一个网站,我从GraphQLAPI获取数据,网站内容有些动态,因此我们使用Apollo客户端来处理一些内容,这使得网站与静态网站相比有点慢,并且不是一个很好的用户体验
我尝试使用gatsby source graphql绑定内容,例如,对于一个查询,它获取一个项目列表,这些项目可以每隔几小时或几周更新一次。必须构建以使这些数据始终保持静态并不是一个很好的解决方案,因为我们的构建时间有限,我们希望使内容有所更新
自定义数据源插件是解决这一问题的可行方案吗?或者有哪些其他内容更新解决方案
标签: Gatsby
github-apinetlify-cms
我正在使用netlify cms2.10.68,netlify cms app2.11.20和Gatsby2.26.1来做一个简单的事件列表站点
当我重新启动服务器或重新部署时,现有的收集项目不会显示在cms中
当检查到github的网络流量以检索项目时,它会将其返回
不知下一步该去哪里
这是:
netlify cms对github的网络响应
{
"sha": "3.....",
"url": "https://api
我需要使用一个内联SVG,这样我就可以设置它的动画,但是SVG小于10KB,所以盖茨比正在将它转换为一个数据uri。有没有办法告诉盖茨比不要将特定资源转换为数据uri?您可以使用
将插件添加到您的gatsby config.js,然后在代码中:
从“./path/Icon.svg”导入图标;
// ...
或者,您也可以使用。添加到Fabian Schultz的答案中
如果您使用@next版本,则Gatsby v2支持
npm安装盖茨比插件-svg@next--保存
回购协议中有两张票被打开
我正在创建一个Gatsby站点,它需要进行动态的fetchapi调用。但是,所讨论的特定api调用不允许客户端api调用——只允许服务器端api调用。因此,我需要在节点环境中使用node fetch
此外,我需要定期(例如,每5分钟)运行这个fetchapi调用
盖茨比能做到这一点吗?如果是这样,我该怎么做呢?就前端而言,盖茨比只是一个固执己见的React配置。听起来您可以通过运行带有crontab的小型服务器来实现这一点,crontab每5分钟执行一个简单的JS脚本,从另一个API获取内容,并
标签: Gatsby
netlifynetlify-function
我在盖茨比项目中设置了netlify函数,包括代理等。如果我通过netlify部署,一切都会按预期进行。如果我用它进行另一次部署,实际上会从netlify中删除我的netlify函数
我尝试过通过netlify UI和toml设置函数。如果我通过Netlify进行部署,这一切都是可行的,但是当我使用gatsby云进行部署时,Netlify功能再次消失
不确定这里的代码是否相关,但请告诉我,我会与大家分享
复制步骤
使用gatsby插件netlify函数设置gatsby项目
将站点添加到Net
Gatsby中的简单auth示例在开发模式下运行良好,但当我尝试构建它时,它将抛出以下错误
WebPackageError:TypeError:window.\u导航不是一个函数
index.js:233导航节点_模块/gatsby链接/index.js:233:1
PrivateRoute.js:11 PrivateRoute src/components/PrivateRoute.js:11:14
似乎错误在于导航函数,这导致了构建错误。我在谷歌上搜索了一下,发现一个修复方法是在useEff
我的GraphQL查询结构如下所示
const query = graphql`
{
allStrapiLogos {
edges {
node {
id
Title
Image {
localFile {
publicURL
}
}
}
}
}
}
`;
因此
您好,我正在从中工作,并设置了一个名为“Bios”的辅助博客。我将博客用作模板,并从.md文件中正确显示它。问题是,当我尝试更新或添加新的bio时,content manager会正确显示,但当我按“发布”时,它不会实际发布更改(绿线永远延伸…)
控制台显示:“未捕获(承诺中)错误:集合的字段名必须是有效的条目标识符,或者必须设置标识符\u字段”
回购协议正在生效
下面是我的config.yaml中的代码
后端:
名称:git网关
分支机构:硕士
媒体文件夹:静态/img
公用文件夹:/img
我最近升级了npm和nodejs(Win1064bit)。现在,每当我尝试运行gatsby develope时,都会出现以下错误:
$ gatsby develop
success open and validate gatsby-configs - 0.050s
success load plugins - 1.124s
success onPreInit - 0.008s
success initialize cache - 0.025s
success copy gatsby files
标签: Gatsby
postcsstailwind-css
我有一个盖茨比的网站,它将顺风作为npm依赖项。在global.css中,我导入@tailwind指令
/* @tailwind preflight; */
@tailwind components;
@tailwind utilities;
/* @tailwind tailwind; */
@tailwind screens;
此css文件将导入index.js(react组件)。但是,我有这样的类名,但是sm没有得到应用
你知道我的设置是否不正确吗?要瞄准真正的小型设备,你只需键入校准中
我试图做的是用Vercel设置dev/staging,所以我需要为我的Gatsby应用程序客户端使用staging键
我所尝试的:
从Vercel项目设置中添加环境预览变量,并连接Gitlab进行集成。然后在dev中提交push-test,以测试env是否工作,但它没有工作。
这应该基于以下线程:
使用Vercel CLI进行部署,它能够公开环境变量,但使用生产变量。我相信这是因为从构建步骤npm运行构建。但是我应该如何公开staging env呢?
任何线索将不胜感激,谢谢 可以通过在Verc
我使用的是Windows操作系统,我使用以下命令安装了gatsby cli:
npm i-g盖茨比cli
安装后,我尝试运行以下命令,以便在gatsby中启动新项目
盖茨比新盖茨比笔记本电脑
但是在运行上面的命令之后,我得到了以下错误
C:\Users\Ruchit Sherathiya\AppData\Roaming\npm\node_modules\gatsby-cli\lib\init-starter.js:117
} catch {
^
SyntaxError:
我在生产版本(盖茨比版本)中设置路由时遇到一些问题
这是控制台中弹出的内容:
error Building static HTML failed
See our docs page on debugging HTML builds for help https://gatsby.app/debug-html
5 | function __webpack_require__(moduleId) {
6 |
> 7 |
目前,我有两个使用gatsby.js开发的站点部署到example.com和blog.example.com。我想创建blog.example.com到example.com/blog的子目录
有没有办法在不合并存储库的情况下进行此操作?您可以在盖茨比博客网站上使用路径前缀将所有内容放在/blog上
见:
基本上,将路径前缀添加到gatsby config.js:
module.exports = {
pathPrefix: `/blog`,
}
然后将--前缀路径添加到所有脚本中:
"b
我知道Gatsby使用代码拆分来优化每个给定页面的捆绑包,但是当我们将页面创建为单个页面应用程序(如中所述)时,我们如何处理它呢
如果我有一个像这样的app.js(取自:
从“React”导入React
从“@reach/Router”导入{Router}
从“./组件/布局”导入布局
从“./组件/详细信息”导入详细信息
从“./组件/主目录”导入主目录
从“./组件/登录名”导入登录名
从“./组件/PrivateRoute”导入PrivateRoute
从“./组件/状态”导入状态
常量应
本地构建没有问题,最终用户在生产构建中不会看到任何问题,除非查看“网络”选项卡。第一个页面请求404,然后页面按预期呈现
预期功能
呈现部门页面组件
/shop/
/shop/category-1/
/shop/category-1/item-type/
呈现PLP页面组件
/shop/
/shop/category-1/
/shop/category-1/item-type/
呈现PDP模板,项目名称是ContentStack中内容的关键,查询参数从单独的产品API中提取产品数据
/s
目前,我正面临一个奇怪的问题,即GatsbyJS与样式化组件的结合
在开发过程中,一切都很好,但当我在本地构建和服务站点时,由样式化组件创建的所有样式都会在页面完成加载后大约100到300毫秒加载。这似乎只适用于布局和模板文件上使用的样式
我还将gatsby插件样式的组件和babel插件样式的组件加入到我的项目中,但没有成功
我创建了一个显示错误的小演示项目。如果需要,您可以下载它并运行纱线&纱线工作区盖茨比主题测试服务,以实时查看错误
是否有人遇到过类似的问题或对此有解决方案
我非常感谢您的帮
我正在组件中使用html块(服务级别协议)。一切都很好,工作正常
我喜欢将这个块放在一个单独的html文件中,然后在组件中使用它,但是
“公开”可用,因此移动应用程序也可以获取此单个文件并在应用程序中显示其内容
主要原因是只有一个文件要维护所有SLA文本 您可以使用在React组件中放置HTML代码
例如:
import htmlFile from "./path/to/html/file.html";
const HtmlDiv = () => (
<div dangero
我正在开发Gatsby静态站点,所以我想使用MDX创建关于已完成项目的页面。在盖茨比中使用MDX的标准语法有什么区别吗:
![alt](path/to/image)
并使用普通标签:
<img src="path/to/image" alt="alt" />
“盖茨比评论图像”是处理使用常规img标记导入的图像,还是它只理解文档中的方法
我问这个问题是因为我需要设置图像的样式,当我像下面的例子那样编写代码时,我得到了很大的嵌套结构
<figure>
![alt]
我在我的GatsbyJS应用程序中使用gatsby插件锚链接导航到另一个页面到特定目标。该应用程序在桌面上运行良好,但在移动设备上,当导航到所选页面而不是滚动到id目标时,页面将在与上一页相同的滚动点打开,而不是滚动到目标
<AnchorLink to={`/services#${serviceId}`}>Service</AnchorLink>
服务
我尝试在gatsby-browse.js中使用shouldUpdateScroll,但我能实现的唯一行为是要么什么都
我用的是LekoArts'。主题本身使用另一个名为的主题
我想更改页面的创建方式。这段代码是核心主题的核心,我不确定如何隐藏它,或者是否可能
据我所知,您只能对直接使用的主题的src文件夹中的文件进行阴影处理
谢谢 盖茨比主题阴影仅适用于src目录和更深层目录中的文件。不过,您应该能够从项目根目录中的gatsby node.js控制页面创建。如果该文件不存在,请创建一个。从核心主题gatsby node.js复制要更改的代码,并在项目根目录中的gatsby node.js中对其进行修改
我是新来的盖茨比,我正在使用顺风css和postcss。我在tailwind.config.js的主题对象中定义的一些颜色配置在开发环境中工作,但在生产环境中不工作。我尝试过清理缓存、删除公用文件夹并重新构建它。这并没有解决问题。tailwind.config.js中我的主题对象如下:
theme: {
colors: {
transparent: 'transparent',
current: 'currentColor',
primary: {
标签: Gatsby
gatsby-imagegatsby-plugin
我试图将图像的路径作为道具传递给组件
注意:组件和索引页都可以通过相同的路径访问图像。当我作为道具通过路径时,它不起作用
在下面的代码中,我尝试使用GatbsyImage和StaticImage标记都失败了
index.js
import React from "react";
import 'bootstrap/dist/css/bootstrap.min.css';
import '../styles/index.scss';
import Main from '../
我正试图在盖茨比项目中添加第二类内容,即“资源”,以及帖子获取资源没问题,但帖子已消失。
设置第二种内容的步骤是什么,这样我就可以从一个帖子转到另一个帖子和(在我的例子中)资源
具备以下条件:
在gatsby config.js中:
{
resolve: 'gatsby-source-filesystem',
options: {
path: `${__dirname}/src/pages`,
name: 'pages',
},
resolve: 'gatsby-
当我配置变压器的pagesPaths选项时,不会调用该选项
module.exports = {
siteMetadata: {
title: 'example.com',
},
plugins: [
{
resolve: 'gatsby-source-filesystem',
options: {
name: 'content',
path: `${__dirname}/src/content`
}
标签: Gatsby
netlifynetlify-cmssanity
我想将页面数据从旧站点迁移(可能转换)到新站点
大纲
我打算在盖茨比现有的一个网站上为一个客户重新命名
客户向我提供了Sanity Studio&Gatsby的源文件
我能够在当地建立《理智工作室》和《盖茨比》网站
问题
据我所知,实际数据仍然托管在先前开发人员的sanity.io帐户上
我无法访问此数据,即使是本地数据
如果不使用原始帐户登录,我无法向本地sanity studio添加新帐户
我更喜欢自动完成,因为总共有大约100页
问题
第1部分
是否有办法接收/访问此数据并将其迁
我在构建网站时遇到问题。当我使用盖茨比发球时,一切都正常,盖茨比建球不会给我任何错误。我希望我有更多的细节,但不幸的是,这个错误代码并没有说什么
我在这个项目中没有netlify.toml或warn.lock。因此,我不能像其他解决方案所建议的那样删除这些内容
我尝试过删除package-lock.json和节点模块以进行新的NPM安装,但没有成功
我不认为安全漏洞是问题所在,但我不确定。我曾经有过这样的经历,发现是NPM给了我这些问题,但我这次的修复也没有起作用
2:11:24 PM: [fe
运行盖茨比建立在生产的基础上。Ubuntu 16
在开发机器上工作
来自服务器的错误:
success write out redirect data - 0.002s
success Build manifest and related icons - 0.471s
success onPostBootstrap - 0.479s
info bootstrap finished - 6.775s
success run static queries - 0.569s - 3/3 5.28/s
我使用GraphiQL中的查询从CMS的Strapi中提取数据。一切正常,如下所示:
query MyQuery {
allStrapiPortfolioPages {
nodes {
order
}
}
}
query MyQuery {
allStrapiPortfolioPages(sort: {order: ASC}) {
nodes {
order
}
}
}
答复如下:
{
"data"
我正在学习盖茨比文档的基本样式教程,css文件并没有被导入或呈现到页面上
说明如下:
2.在gatsby-browser.js文件中导入最近创建的样式表:
import "./src/styles/global.css"
global.css只是有一个html标记:
html {
background-color: red;
}
但是背景色没有显示。web服务器正在运行,我正在查看正确的页面。(我可以在index.js中添加更多文本,它会显示出来)。文件已保存
我使用的是盖茨比插件较少的插件,但没有真正的方向,它似乎不是即插即用的。您需要通过将插件添加到根文件夹中的gatsby config.js文件来“激活”插件。然后您只需将较少的文件导入布局/index.js`
// in gatsby-config.js
plugins: [
`gatsby-plugin-less`
]
POSTSS还用于处理一些默认优化,如自动刷新和常见的跨浏览器flexbox错误。通常情况下,您不需要考虑它,但如果您希望在较少的输出中添加额外的后处理,则可以在插件选项
在gatsby-node.js中以编程方式创建页面时,我可以将上下文传递给我的页面组件:
createPage({
path: path,
component: docTemplate,
context: {}, // additional data can be passed via context
})
似乎我可以在这里传递生成文档所需的上下文,而不必再次在单个页面上查询文档。我不想这样做的原因是什么?可能只是为可能与每个页面相关的数据保留页面上下文。每种不同类型的页面很可能会
我正试图让盖茨比的项目在一个新系统上运行,但我在运行盖茨比开发时遇到了一个问题。它似乎与我在项目中添加()的npm包有关。终端输出
ERROR
UNHANDLED REJECTION Unable to find plugin "gatsby-plugin-use-dark-mode". Perhaps you need to install its package?
Error: Unable to find plugin "gatsby-plugin-use-dark-mode". Perh
我有一个使用Gatsby.js开发的网站。我集成了Netlify CMS。我想上传图像和其他文件到同一个文件夹中的标记将被放置在我。E在{{year}}-{{month}-{{day}}{{slug}}/中
真的要这么做吗
// admin/config.yml:
backend:
name: github
repo: ###
media_folder: packages/modern-agency/static/assets
public_folder: /assets
coll
每当我使用
entitiesArray: [
{
url: `http://yourapi.com/api/v1/posts`,
method: "post",
headers: {
"Content-Type": "application/json"
},
name: `posts`,
上一页 1 2 3 4 5 6 7 8 9 ...
下一页 最后一页 共 14 页