forked from ProjectEvergreen/greenwood-demo-adapter-vercel
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Loading status checks…
patch support for hydration and import map script slotting
1 parent
1035df6
commit ae72260
Showing
3 changed files
with
745 additions
and
15 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
58 changes: 58 additions & 0 deletions
58
patches/@greenwood+plugin-renderer-lit+0.30.0-alpha.7.patch
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,58 @@ | ||
diff --git a/node_modules/@greenwood/plugin-renderer-lit/src/index.js b/node_modules/@greenwood/plugin-renderer-lit/src/index.js | ||
index ca77f42..ac7454e 100755 | ||
--- a/node_modules/@greenwood/plugin-renderer-lit/src/index.js | ||
+++ b/node_modules/@greenwood/plugin-renderer-lit/src/index.js | ||
@@ -14,16 +14,48 @@ class LitHydrationResource extends ResourceInterface { | ||
|
||
async intercept(url, request, response) { | ||
const { importMaps } = this.compilation.config.polyfills; | ||
- const importMapType = process.env.__GWD_COMMAND__ === 'develop' && importMaps // eslint-disable-line no-underscore-dangle | ||
+ const isDevelopment = process.env.__GWD_COMMAND__ === 'develop'; // eslint-disable-line no-underscore-dangle | ||
+ const importType = isDevelopment && importMaps | ||
? 'module-shim' | ||
: 'module'; | ||
+ const importMapType = isDevelopment && importMaps | ||
+ ? 'importmap-shim' | ||
+ : 'importmap'; | ||
+ const headSelector = isDevelopment ? `<script type="${importMapType}">` : '<head>'; | ||
+ const hydrationSupportScriptPath = '/node_modules/@lit-labs/ssr-client/lit-element-hydrate-support.js'; | ||
let body = await response.text(); | ||
|
||
// this needs to come first before any userland code | ||
- body = body.replace('<head>', ` | ||
- <head> | ||
- <script type="${importMapType}" src="/node_modules/@lit-labs/ssr-client/lit-element-hydrate-support.js"></script> | ||
- `); | ||
+ // but before any import maps | ||
+ if(isDevelopment) { | ||
+ // quick way to find the ending position of the importmap <script> tag | ||
+ // and append the hydration support <script> right after it | ||
+ const scriptEndPattern = /<\/script>/g; | ||
+ const importMapStartPos = body.indexOf(headSelector) ?? ''; | ||
+ let importMapEndPos = 0; | ||
+ let match; | ||
+ | ||
+ while ((match = scriptEndPattern.exec(body)) !== null) { | ||
+ const position = match.index; | ||
+ if (position > importMapStartPos) { | ||
+ importMapEndPos = position; | ||
+ break; | ||
+ } | ||
+ | ||
+ } | ||
+ | ||
+ body = ` | ||
+ ${body.slice(0, importMapEndPos)} | ||
+ </script> | ||
+ <script type="${importType}" src="${hydrationSupportScriptPath}"></script> | ||
+ ${body.slice(importMapEndPos + 9)} | ||
+ `; | ||
+ } else { | ||
+ body = body.replace(headSelector, ` | ||
+ ${headSelector} | ||
+ <script type="${importType}" src="${hydrationSupportScriptPath}"></script> | ||
+ `); | ||
+ } | ||
|
||
return new Response(body); | ||
} |