From 42e241c277d4b063ff9fc70cb0af8644e6bce6a0 Mon Sep 17 00:00:00 2001 From: Ward Peeters Date: Wed, 7 Sep 2022 05:51:41 +0200 Subject: [PATCH] feat(gatsby): split up head & page component loading (#36545) * separate chunk for head, remove default * use partial hydration env in loader Co-authored-by: Jude Agboola --- packages/gatsby/cache-dir/loader.js | 12 ++++++++---- packages/gatsby/src/bootstrap/requires-writer.ts | 5 ++++- 2 files changed, 12 insertions(+), 5 deletions(-) diff --git a/packages/gatsby/cache-dir/loader.js b/packages/gatsby/cache-dir/loader.js index 7bd7bfc5bf2f0..29728570ae4c2 100644 --- a/packages/gatsby/cache-dir/loader.js +++ b/packages/gatsby/cache-dir/loader.js @@ -573,15 +573,19 @@ const createComponentUrls = componentChunkName => export class ProdLoader extends BaseLoader { constructor(asyncRequires, matchPaths, pageData) { - const loadComponent = chunkName => { - if (!asyncRequires.components[chunkName]) { + const loadComponent = (chunkName, exportType = `components`) => { + if (!global.hasPartialHydration) { + exportType = `components` + } + + if (!asyncRequires[exportType][chunkName]) { throw new Error( - `We couldn't find the correct component chunk with the name ${chunkName}` + `We couldn't find the correct component chunk with the name "${chunkName}"` ) } return ( - asyncRequires.components[chunkName]() + asyncRequires[exportType][chunkName]() // loader will handle the case when component is error .catch(err => err) ) diff --git a/packages/gatsby/src/bootstrap/requires-writer.ts b/packages/gatsby/src/bootstrap/requires-writer.ts index b0f98883581be..2c2ea7a3ea2a4 100644 --- a/packages/gatsby/src/bootstrap/requires-writer.ts +++ b/packages/gatsby/src/bootstrap/requires-writer.ts @@ -246,7 +246,10 @@ const preferDefault = m => (m && m.default) || m // Create file with async requires of components/json files. let asyncRequires = `` - if (process.env.gatsby_executing_command === `develop`) { + if ( + process.env.gatsby_executing_command === `develop` || + (_CFLAGS_.GATSBY_MAJOR === `5` && process.env.GATSBY_PARTIAL_HYDRATION) + ) { asyncRequires = `exports.components = {\n${components .map((c: IGatsbyPageComponent): string => { // we need a relative import path to keep contenthash the same if directory changes