Gatsby 总是获取缓存的数据
Posted
技术标签:
【中文标题】Gatsby 总是获取缓存的数据【英文标题】:Gatsby always fetch cached data 【发布时间】:2020-09-17 04:15:15 【问题描述】:我使用gatsby-source-git 从 Github repository 中提取文件。它运行良好,但我在 repository 中添加了一些文件,我无法将新文件拉入我的 Gatsby 项目。
如果我在http://localhost:8000/___graphql
中运行此查询:
query MyQuery
allMarkdownRemark
edges
node
frontmatter
title
fileAbsolutePath
我得到这个结果:
"data":
"allMarkdownRemark":
"edges": [
"node":
"frontmatter":
"title": "Introduction"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/index.md"
,
"node":
"frontmatter":
"title": "Conceptual Guide"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/tau-conceptual-guide.md"
,
"node":
"frontmatter":
"title": "Tau & Agoras Overview"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/what-is-tauchain-tau.md"
,
"node":
"frontmatter":
"title": "FAQs"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/tauchain-agoras-faqs.md"
,
"node":
"frontmatter":
"title": "Tutorials"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/Tutorials/index.md"
,
"node":
"frontmatter":
"title": "Analysis of TauBot.TML"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/Tutorials/analysis-of-taubot-tml.md"
,
"node":
"frontmatter":
"title": "TML Bot Tutorial"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/Tutorials/tml-Bot-tutorial.md"
,
"node":
"frontmatter":
"title": "Understanding TML"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/Tutorials/understanding-tml-prolog-datalog-tau.md"
,
"node":
"frontmatter":
"title": "Quick Start"
,
"fileAbsolutePath": "dev/tau-guide-website/.cache/gatsby-source-git/tau-guide-documents/docs/quick-start.md"
]
Tutorials 文件夹包含 6 个文件,这些文件不包含在查询结果中。我不知道为什么。
gatsby-config.js
require("dotenv").config(
path: `.env.$process.env.NODE_ENV`
);
module.exports =
siteMetadata:
title: "Fan Site"
,
plugins: [
"gatsby-plugin-react-helmet",
"svgo",
"gatsby-plugin-sass",
"gatsby-plugin-postcss",
resolve: "gatsby-source-filesystem",
options:
name: "data",
path: `$__dirname/src/data/`
,
resolve: "gatsby-source-filesystem",
options:
path: `$__dirname/src/pages`,
name: "pages"
,
resolve: `gatsby-transformer-remark`,
options:
plugins: [`gatsby-remark-autolink-headers`]
,
"gatsby-transformer-json",
"gatsby-plugin-dark-mode",
resolve: "gatsby-source-prismic-graphql",
options:
repositoryName: "funsite",
accessToken: `$process.env.API_KEY`
,
resolve: `gatsby-source-git`,
options:
name: `tau-guide-documents`,
remote: `https://github.com/TauGuide/tau-guide-documents.git`,
branch: `master`,
// Only import the docs folder from a codebase.
patterns: `docs/**`
]
;
我尝试将local: "/dev/tauguide/tau-guide-documents",
添加为gatsby-source-git
选项,但没有帮助。
我尝试运行gatsby clean
,它删除了.cache
文件夹和gatsby develop
,但我得到了相同的结果。生成.cache
文件夹时,所有文件都在,只有查询结果不包含。
我试图删除该项目并再次从 git 中提取它,但它没有帮助。
package.json
"name": "fan-site",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts":
"develop": "gatsby develop",
"build": "gatsby build",
"serve": "gatsby serve",
"start": "node server.js",
"gh-pages": "gatsby build --prefix-paths && gh-pages -d public",
"lint": "eslint src --fix",
"dev": "(shx --silent rm -rf public .cache || shx true) && gatsby develop",
"server": "cross-env NODE_ENV=development DEBUG=api nodemon server.js",
"postinstall": "npm rebuild node-sass"
,
"author": "Prototype Interactive",
"license": "MIT",
"dependencies":
"@fortawesome/fontawesome-svg-core": "^1.2.25",
"@fortawesome/free-brands-svg-icons": "^5.12.0",
"@fortawesome/free-solid-svg-icons": "^5.11.2",
"@fortawesome/react-fontawesome": "^0.1.7",
"@kunukn/react-collapse": "1",
"@material-ui/core": "^4.9.5",
"@popperjs/core": "^2.3.3",
"add": "^2.0.6",
"axios": "^0.19.0",
"basic-auth": "^2.0.1",
"bootstrap": "4.2.1",
"chart.js": "^2.9.3",
"d3-node": "^2.2.1",
"debug": "^4.1.1",
"font-awesome": "4.7.0",
"framer-motion": "^1.10.3",
"gatsby": "^2.18.12",
"gatsby-plugin-canonical-urls": "^2.3.0",
"gatsby-plugin-dark-mode": "^1.1.0",
"gatsby-remark-autolink-headers": "^2.3.3",
"gatsby-source-git": "^1.0.2",
"gatsby-source-prismic-graphql": "3.6.2",
"gatsby-transformer-remark": "^2.6.53",
"lodash.get": "^4.4.2",
"lodash.groupby": "^4.6.0",
"lodash.pickby": "^4.6.0",
"lodash.set": "^4.3.2",
"lodash.update": "^4.10.2",
"marked": "^0.8.0",
"moment": "^2.24.0",
"prismic-reactjs": "^1.3.1",
"prop-types": "^15.7.2",
"react-chartjs-2": "^2.8.0",
"react-collapsible": "^2.6.3",
"react-d3-components": "^0.9.1",
"react-d3-library": "^1.1.8",
"react-headroom": "^3.0.0",
"react-helmet": "^5.2.0",
"react-lazyload": "^2.6.5",
"react-moment": "^0.9.6",
"react-onclickout": "^2.0.8",
"react-popper": "^2.2.3",
"react-popper-tooltip": "^2.11.1",
"react-responsive": "^8.0.1",
"react-scroll-to": "^3.0.0-beta.3",
"react-select": "^3.1.0",
"react-sidebar": "^3.0.2",
"react-slick": "^0.25.2",
"react-svg-donuts": "^1.0.0",
"react-telegram-embed": "^0.0.10",
"react-toastify": "^5.4.1",
"react-twitter-embed": "^3.0.3",
"react-window": "^1.8.5",
"reactstrap": "^8.4.1",
"slick-carousel": "^1.8.1",
"underscore": "^1.9.1",
"yarn": "^1.21.1"
,
"devDependencies":
"@prototype-interactive/eslint-config": "^0.1.1",
"autoprefixer": "^9.4.4",
"cross-env": "^5.2.0",
"dotenv": "^8.2.0",
"eslint": "^5.12.0",
"gatsby-plugin-google-analytics": "^2.3.0",
"gatsby-plugin-postcss": "^2.0.2",
"gatsby-plugin-postcss-sass": "^1.0.22",
"gatsby-plugin-react-helmet": "^3.0.5",
"gatsby-plugin-sass": "^2.0.7",
"gatsby-source-filesystem": "^2.2.2",
"gatsby-transformer-json": "^2.1.7",
"gh-pages": "^2.0.1",
"husky": "^1.3.1",
"prettier": "^1.15.3",
"pretty-quick": "^1.8.0",
"react": "^16.7.0",
"react-dom": "^16.7.0",
"shx": "^0.3.2",
"svg-sprite-loader": "^4.1.3"
,
"resolutions":
"gatsby-source-graphql-universal": "3.3.0"
,
"repository":
"type": "git",
"url": "git+https://github.com/PrototypeInteractive/gatsby-react-boilerplate.git"
,
"bugs":
"url": "https://github.com/PrototypeInteractive/gatsby-react-boilerplate/issues"
,
"homepage": "https://github.com/PrototypeInteractive/gatsby-react-boilerplate#readme"
gatsby-node.js
const path = require(`path`);
const createFilePath = require(`gatsby-source-git`);
exports.onCreateNode = ( node, getNode, actions ) =>
const createNodeField = actions;
if (node.internal.type === `MarkdownRemark`)
const slug = createFilePath( node, getNode, basePath: `pages` );
createNodeField(
node,
name: `slug`,
value: slug
);
;
exports.createPages = async ( graphql, actions ) =>
const createPage = actions;
const result = await graphql(`
query
allMarkdownRemark
edges
node
fields
slug
`);
result.data.allMarkdownRemark.edges.forEach(( node ) =>
createPage(
path: node.fields.slug,
component: path.resolve(`src/templates/tau-document.js`),
context:
// Data passed to context is available
// in page queries as GraphQL variables.
slug: node.fields.slug
);
);
;
【问题讨论】:
看起来Tutorials
中仅缺少 2 个文件:1 和 2。它是否正确?我可以在您发布的查询结果中看到其他人。
@RobinMétral 是的。
【参考方案1】:
Tutorials
文件夹中仅缺少两个文件:step-by-step-guide-how-to-buy-agoras.md
和 step-by-step-guide-how-to-store-agoras.md
。
我认为问题在于这些文件中的frontmatter 格式,而不是gatsby-source-git
。
如您所见,它们与其他文件的区别在于它们的值中都有冒号:
title: Agoras: How to Store
description: Agoras: How to Buy
你需要add quotes around those:
title: "Agoras: How to Store"
description: "Agoras: How to Buy"
您的查询可能无法解析这些文件,因此文件没有出现。如果这能解决您的问题,请告诉我!
【讨论】:
以上是关于Gatsby 总是获取缓存的数据的主要内容,如果未能解决你的问题,请参考以下文章
使用 Gatsby/Contentful 从 Graphql 获取参考数据
gatsby 无法获取所有关于 vercel 生产的 graphql 数据