GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES is broken for static queries

[TAGraves]

Description

When running gatsby build with GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES=true, an error is thrown if anything is using useStaticQuery.

Sample error:

Can't resolve '../../public/static/d/856328897.json' in '/path/to/src/components

Steps to reproduce

Sample project (which is just a project initialized with gatsby new: https://github.com/TAGraves/gatsby-incremental-example

First, run:

GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES=true yarn gatsby build --log-pages

which should output

info Built pages:
Updated page: /404/
Updated page: /
Updated page: /page-2/
Updated page: /404.html

Then, remove everything from .cache and public other than .cache/redux:

rm -r public
cd .cache && ls | grep -v redux | xargs
cd ../

Then run gatsby build again:

GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES=true yarn gatsby build --log-pages 

Expected result

gatsby build should complete showing no new, updated, or deleted pages.

Actual result

gatsby build fails with an error like

Can't resolve '../../public/static/d/856328897.json' in '/path/to/src/components

Environment

  System:
    OS: macOS 10.15.3
    CPU: (8) x64 Intel(R) Core(TM) i7-7920HQ CPU @ 3.10GHz
    Shell: 3.2.57 - /bin/bash
  Binaries:
    Node: 10.14.0 - /var/folders/xh/kxyylf2j2k51pw11htddhb9c0000gn/T/yarn--1585491262407-0.3432572041341917/node
    Yarn: 1.12.3 - /var/folders/xh/kxyylf2j2k51pw11htddhb9c0000gn/T/yarn--1585491262407-0.3432572041341917/yarn
    npm: 6.4.1 - ~/.nvm/versions/node/v10.14.0/bin/npm
  Languages:
    Python: 2.7.16 - /Users/tommygraves/.pyenv/shims/python
  Browsers:
    Chrome: 80.0.3987.149
    Firefox: 74.0
    Safari: 13.0.5
  npmPackages:
    gatsby: ^2.19.45 => 2.19.45
    gatsby-image: ^2.2.44 => 2.2.44
    gatsby-plugin-manifest: ^2.2.48 => 2.2.48
    gatsby-plugin-offline: ^3.0.41 => 3.0.41
    gatsby-plugin-react-helmet: ^3.1.24 => 3.1.24
    gatsby-plugin-sharp: ^2.4.13 => 2.4.13
    gatsby-source-filesystem: ^2.1.56 => 2.1.56
    gatsby-transformer-sharp: ^2.3.19 => 2.3.19

If you remove all the static queries from the components, the command runs successfully and has the expected behavior.

Tagging @dominicfallows since they built this feature. I do wonder if this is related to #21555 since the PR and documentation around GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES mention the old redux.state file rather than the new redux directory. Thanks friends!

[vladar]

CC @pieh

[pieh]

Then, remove everything from .cache and public other than .cache/redux:

rm -r public
cd .cache && ls | grep -v redux | xargs
cd ../

Per https://www.gatsbyjs.org/docs/build-caching/

Build outputs are stored in the .cache and public directories relative to your project root.

So if you selectively remove parts of cached state / artificats your cache is no longer consistent and is bound to break. Just btw. regular gatsby build (not GATSBY_EXPERIMENTAL_PAGE_BUILD_ON_DATA_CHANGES variant) will fail with same error if you delete everything but persisted redux state as well.

[TAGraves]

@pieh Maybe I'm misunderstanding the experimental flag. Based on https://www.gatsbyjs.org/docs/page-build-optimizations-for-incremental-data-changes/ it sounded to me like the intention was to use this in CI and the only need to persist anything would be the redux files:

At the end of each build, gatsby creates a redux.state file in /.cache that contains previous build data. You will need to persist the .cache/redux.state between builds, allowing for comparison. If there is no redux.state file located in the /.cache folder then a full build will be triggered.

Are you suggesting the entire .cache and public directory needs to be persisted across builds? I was trying to replicate a CI scenario where you'd selectively persist only the redux state files and build the site inside a docker container.

[pieh]

Are you suggesting the entire .cache and public directory needs to be persisted across builds?

Ah, the documentation on https://www.gatsbyjs.org/docs/page-build-optimizations-for-incremental-data-changes/ need to be reworded. It is how the feature works (using persisted .cache/redux), but gatsby in general need to just keep .cache and public directories.

[TAGraves]

@pieh Ah, got it - this can probably be closed then. Is there any long-term plan for being able to do incremental builds without having to keep those directories (or is there a recommended approach if you are building inside of a docker container inside CI and have multiple environments you're building?)

[pieh]

There are no plans like that right now. There are some build artefacts outputted directly to public directory (query results, images (if you use image transformatoin) ) and gatsby will rely on .cache/redux to know when it can reuse previous artefacts. In case when you delete public, cached redux state will think it can reuse those (now deleted) files produced by previous builds. (that's why you get can't find some module, because file was not regenerated because cache thinks it's still there and doesn't need to be rebuild).

We could probably add nicer error messages explaining this, but I don't think we can make drastic change here.

[TAGraves]

Thanks for your help!