Fix pagefind site search by preloading window.pagefind - #2399
Merged
Merged
Conversation
@getcanary/web's pagefind provider does a dynamic import of /pagefind/pagefind.js with a webpackIgnore comment. The bundler inlines it anyway, so the import fails at runtime with MODULE_NOT_FOUND and search returns no results. The provider uses window.pagefind when present, so load it from a head module script. Same fix as reduxjs/redux#4949.
|
Size Change: 0 B Total Size: 37.1 kB ℹ️ View Unchanged
|
commit: |
✅ Deploy Preview for react-redux-docs ready!
To edit notification comments on pull requests, go to your Netlify project configuration. |
This file contains hidden or 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
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Problem
Site search opens and accepts input but never shows results.
@getcanary/web's pagefind provider doesThe bundler inlines that dynamic import instead of leaving it as a browser import (this is the build-time "Critical dependency: the request of a dependency is an expression" warning). At runtime it throws
MODULE_NOT_FOUND: Cannot find module '/pagefind/pagefind.js', the provider logsFailed to import pagefindat info level and gives up. Confirmed on the live site:window.pagefindis undefined and results are empty, while a manualimport('/pagefind/pagefind.js')returns hits, so the index itself is fine.Fix
The provider checks
window.pagefindfirst and skips the import when it exists. Add aheadTagsmodule script that loads/pagefind/pagefind.jsand assigns it towindow.pagefind. 12-line config change, no dependency changes.Same fix as reduxjs/redux#4949, where the deploy preview confirmed search works again.
Verification
pnpm buildsucceeds; built HTML contains the preload script.