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.mdstep-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 数据

Gatsby 从数据中获取具有相对路径的图像文件夹

cURL 总是获取缓存的副本

Gatsby - 使用 createRemoteFileNode 获取远程图像

如果在 Gatsby 中布尔键匹配 true,则从对象内的对象数组中获取项目 - Graphql