Gatsby Contentful Preview Error

[alexantom]

I'm using Gatsby(3.5.0)+ Contentful + Tailwind for new project and configured a preview server in containerized environment

We are facing issue with preview server, as we trying to refresh the data

Steps to reproduce

1. Start gatsby develop app in localhost
2. Access http://loclhost:8000
3. Edit Content in contentful and keep in draft state
4. curl -X POST http://localhost:8000/__refresh
5. Open existing browser tab of develop site http://loclhost:8000

I will try to setup a new working demo repo ,as my current project repo can't be shared

Meanwhile if somebody faced similar issue, please let me know if you have found root cause and a fix

Loading hot update chunk node_modules_gatsby-plugin-image_dist_lazy-hydrate-99f9d741_js failed. (missing: http://localhost:8000/node_modules_gatsby-plugin-image_dist_lazy-hydrate-99f9d741_js.561b25dbfc6dbe6e016e.hot-update.js)

Loading hot update chunk node_modules_gatsby-plugin-image_dist_intersection-observer-6b794dd8_js failed. (missing: http://localhost:8000/node_modules_gatsby-plugin-image_dist_intersection-observer-6b794dd8_js.561b25dbfc6dbe6e016e.hot-update.js)

gatsby-config.js

module.exports = {
  siteMetadata: {
    title: `Gatsby with Contentful`,
    url: `http://localhost:8000
  },
  plugins: [
    `gatsby-plugin-react-helmet`,
    `gatsby-plugin-typegen`,
    `gatsby-plugin-image`,
    `gatsby-plugin-sharp`,
    `gatsby-transformer-sharp`, // Needed for dynamic images
    {
      resolve: 'gatsby-plugin-web-font-loader',
      options: {
        typekit: {
          id: 'idval'
        }
      }
    },
    {
      resolve: `gatsby-plugin-postcss`,
      options: {
        postCssPlugins: [
          require(`postcss-import`),
          require(`postcss-extend`),
          require(`postcss-nested`),
          require(`autoprefixer`),
          ...(process.env.NODE_ENV === `production`
            ? [require(`cssnano`)]
            : [])
        ]
      }
    },
    {
      resolve: `gatsby-source-filesystem`,
      options: {
        name: `images`,
        path: path.join(__dirname, `src`, `images`)
      }
    },
    {
      resolve: `gatsby-source-contentful`,
      options: contentfulConfig
    },
    `gatsby-transformer-remark`
  ]
}

[alexantom]

https://github.com/gatsbyjs/gatsby/tree/master/examples/using-contentful

@KyleAMathews

Do you have contentful data export for this example app https://using-contentful.netlify.app/

https://discovery.contentful.com/entries/by-content-type/2PqfXUJwE8qSYKuM0U6w8M?delivery_access_token=e481b0f7c5572374474b29f81a91e8ac487bb27d70a6f14dd12142837d8e980a&space_id=ubriaw6jfhm1

I would like to export the data associated with example app to my contentful and test it.

[alexantom]

localhost-1622183789572.log

[alexantom]

Looks like have narrowed down the issue with usage of gatsby-plugin-image, i ended up commenting all usage and couldn't reproduce above issue. Need more time to identify a fix