{"record":{"id":"64730081116ec91f","repo":"gatsbyjs/gatsby","slug":"we-couldn-t-find-the-correct-component-chunk-with-647300","errorCode":null,"errorMessage":"We couldn't find the correct component chunk with the name \"${chunkName}\"","messagePattern":"We couldn't find the correct component chunk with the name \"(.+?)\"","errorType":"exception","errorClass":null,"httpStatus":null,"severity":"error","filePath":"packages/gatsby/cache-dir/loader.js","lineNumber":849,"sourceCode":"      }\n    )\n  }\n}\n\nconst createComponentUrls = componentChunkName =>\n  (window.___chunkMapping[componentChunkName] || []).map(\n    chunk => __PATH_PREFIX__ + chunk\n  )\n\nexport class ProdLoader extends BaseLoader {\n  constructor(asyncRequires, matchPaths, pageData) {\n    const loadComponent = (chunkName, exportType = `components`) => {\n      if (!global.hasPartialHydration) {\n        exportType = `components`\n      }\n\n      if (!asyncRequires[exportType][chunkName]) {\n        throw new Error(\n          `We couldn't find the correct component chunk with the name \"${chunkName}\"`\n        )\n      }\n\n      return (\n        asyncRequires[exportType][chunkName]()\n          // loader will handle the case when component is error\n          .catch(err => err)\n      )\n    }\n\n    super(loadComponent, matchPaths)\n\n    if (pageData) {\n      this.pageDataDb.set(findPath(pageData.path), {\n        pagePath: pageData.path,\n        payload: pageData,\n        status: `success`,","sourceCodeStart":831,"sourceCodeEnd":867,"githubUrl":"https://github.com/gatsbyjs/gatsby/blob/8b06340921ffdf23125a365b9c9923690cb62ce6/packages/gatsby/cache-dir/loader.js#L831-L867","documentation":"Thrown by ProdLoader.loadComponent in the production browser bundle when the requested component chunk name does not exist in the webpack asyncRequires map. This mirrors the dev-loader error (104) but occurs in production after the bundle loads, meaning the route references a chunk that was not included in the build.","triggerScenarios":"The production JS bundle tries to load a component chunk by name, but asyncRequires['components'][chunkName] is undefined. This happens when the page-data.json references a component chunk that wasn't generated — typically due to a build inconsistency, a stale page-data cache, or partial hydration mismatch when hasPartialHydration is toggled.","commonSituations":"Deploying a new build where page-data JSON from a previous build is still cached by the browser/CDN, switching partial hydration (ISR/DSG) flags between builds without clearing cache, a createPage call referencing a component that errored during build (chunk not emitted), or a mismatch between the page-data and the actual webpack output.","solutions":["Run `gatsby clean` before building to ensure .cache and public are fresh.","Verify the build completed without errors — check for chunk emission failures in build logs.","If switching partial hydration settings, clear CDN/browser caches and redeploy.","Inspect the page-data JSON for the failing path and confirm the componentChunkName exists in the webpack stats or the app chunk mapping."],"exampleFix":"# before — stale cache after toggling partial hydration\ngatsby build  # page-data references old chunk names\n\n# after\ngatsby clean && gatsby build\n# then purge CDN cache before going live","handlingStrategy":"validation","validationCode":"// Post-build validation: check all chunk names referenced in page-data exist\nconst fs = require('fs')\nconst path = require('path')\n\nfunction validateChunks(publicDir) {\n  const appJs = fs.readFileSync(path.join(publicDir, 'app-xxx.js'), 'utf8')\n  // Cross-reference componentChunkName fields in page-data JSONs\n  // against the chunk mapping in the built JS\n  // (simplified — adapt to your build output)\n  const pdDir = path.join(publicDir, 'page-data')\n  // ...walk page-data, extract componentChunkName, verify in chunk mapping\n}\n","typeGuard":null,"tryCatchPattern":null,"preventionTips":["Run `gatsby clean` before every production build.","Purge CDN and browser caches when deploying builds with changed chunk hashes.","Don't toggle partial hydration flags between deployments without a clean rebuild.","Monitor build logs for chunk emission warnings or errors."],"tags":["production","webpack","chunk","routing","prod-loader","partial-hydration"],"backgroundTag":null,"analyzedSha":"8b06340921ffdf23125a365b9c9923690cb62ce6","analyzedAt":"2026-08-13T02:36:21.405Z","schemaVersion":2},"datasetVersion":"2026-08-13T04:17:16.726Z"}