Reactjs 图像的变化往往不'；在开发中使用盖茨比时，不要在页面上反映出来

我在《盖茨比》中经历了这种奇怪的画面行为。很多时候，当我将图像从一个文件更改为另一个文件（通常通过重命名我拥有的本地文件）时，图像的更改不会反映在页面上。我正在开发中，所以我还没有在

http://localhost:8000

来自

gatsby develop

我认为这是因为缓存，但在清除浏览器缓存后，问题仍然存在，即图像没有更新。但不知何故，它会在几个小时后消失，这意味着页面上的图像将按预期更新

相关的代码片段是

我在某处有一个

index.md

，它有一个条目

avatar:'./me.jpg'

，在同一个文件夹下，我有一个名为

me.jpg

的图像文件。以及页面如何通过graphql查询“读取”图像

   export const pageQuery = graphql`
  {
    hero: allMarkdownRemark(filter: { fileAbsolutePath: { regex: "/hero/" } }) {
      edges {
        node {
          frontmatter {
            title
            name
            subtitle
            contactText
            avatar {
              childImageSharp {
                fluid(maxWidth: 6000, quality: 100) {
                  ...GatsbyImageSharpFluid_withWebp
                }
              }
            }
          }
          html
        }
      }
    }

当我想更改图像时，我会将一个新的图像文件复制到文件夹中，并将其重命名为

me.jpg

（当然是在我重命名原始的

me.jpg

）之后）。然后我返回到我希望图像得到更新的页面。但奇怪的是，页面上的图像通常不会更新，而是保持不变

---

我还试图关闭本地服务器并通过

gatsby develope重新启动它

，但是它没有解决问题

原因是当您启动

gatsby develope

时，GraphQL查询只运行一次。图像中的更改不会反映出来，因为在develop仍在运行时查询不会刷新

---

另一个原因是，您的绑定器很可能会比较文件名，并发现它是相同的文件名。再次启动

gatsby develope

时，它不会重新加载文件。即使重新启动后，旧文件仍在

.chache

或

public

文件夹中。在再次运行

gatsby develope

之前，您必须运行

gatsby clean

。

可能是捆绑机/包装机出现问题，请在出现这种情况时尝试重新启动捆绑机。确保所有

gatsby

和

gatsby-*

软件包都是最新的（

warn update interactive

是您的朋友）。夏普和图像管道存在一些缓存问题。然后还可以运行

gatsby clean

清除缓存的转换，然后重新运行

gatsby develope

。