konstantinmuenster / gatsby-theme-portfolio-minimal

A Gatsby Theme to create modern one-page portfolios with a clean yet expressive design.

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Build cache errors if editing shadowed ProjectsSectionQuery in data.tsx

ansmlc opened this issue · comments

Hi, thanks for creating this awesome theme!
I'm trying to shadow the theme files so I can customize it to my needs, and could some help.

I shadowed the entire theme, not just some components, as otherwise there's a lot of missing dependency errors to deal with. I copied the entire contents of my-portfolio/node_modules/gatsby-theme-portfolio-minimal/src directory into my-portfolio/src/gatsby-theme-portfolio-minimal/.

Error occurs when editing ProjectsSectionQuery query in my-portfolio/src/gatsby-theme-portfolio-minimal/sections/Projects/data.tsx, causing the development build to fail. Not sure but it seems to be related to caching issues.

Specifically, I came across this as I tried to increase project image size. Either changing the width value or removing it altogether causes the same build error:

  src {
      childImageSharp {
          gatsbyImageData(width: 1000)
  }

As a test, I also tried removing the linkTo from the image node (which I'm not using in projects.json anyway), which causes the same error. I haven't tried editing any other data.tsx components or queries.

1. Running gatsby develop shows this error:

ERROR  UNKNOWN

Module not found: Error: Can't resolve '../../../../public/page-data/sq/d/1487972840.json' in
'E:\portfolio-minimal\src\gatsby-theme-portfolio-minimal\sections\Projects'

 ModuleNotFoundError: Module not found: Error: Can't resolve '../../../../public/page-data/sq/d/1487972840.json' in 'E:\portfolio-minimal\src\gatsby-theme-portfolio
  -minimal\sections\Projects'

2. If the query is edited while development build is already running, it works and changes are successfully reflected on localhost:8000. However, if the dev server is restarted, it fails again with the above error.

3. Running gatsby build successfully builds every time. However, if the build contains the edited query, running gatsby serve on localhost:9000 just shows a blank screen, while the DevTools console shows errors:

Error: The result of this StaticQuery could not be fetched.

This is likely a bug in Gatsby and if refreshing the page does not fix it, please open an issue in https://github.com/gatsbyjs/gatsby/issues
    at l (static-query.js:83:11)
    at _ (data.tsx:18:12)
    at Eo (react-dom.production.min.js:167:137)
    at xi (react-dom.production.min.js:290:337)
    at bs (react-dom.production.min.js:280:389)
    at vs (react-dom.production.min.js:280:320)
    at gs (react-dom.production.min.js:280:180)
    at ls (react-dom.production.min.js:271:88)
    at as (react-dom.production.min.js:268:429)
    at S (scheduler.production.min.js:13:203)

If this is not reproducing, run gatsby clean before gatsby build.

4. There are no issues when editing other shadowed files, whether it's components or styles, as long as the Query is untouched. Both gatsby develop and gatsby build work fine and the page is properly rendered, including any changes in other shadow files.

Hey @ansmlc! Sorry for the late response. Seems like it may causes conflicts with the existing query. Have you tried changing the query and renaming it (e.g ProjectsSectionQuery2)? If that doesn't fix it, it will take a closer look at the issue locally 👍