Skip to content

fix(search): use absolute bundle-path for Pagefind Component UI#1021

Merged
DeepDiver1975 merged 1 commit into
masterfrom
fix-pagefind-bundle-path
Jun 16, 2026
Merged

fix(search): use absolute bundle-path for Pagefind Component UI#1021
DeepDiver1975 merged 1 commit into
masterfrom
fix-pagefind-bundle-path

Conversation

@DeepDiver1975

Copy link
Copy Markdown
Member

Problem

Pagefind search fails on doc.owncloud.com — opening the search modal shows "Pagefind Error: Could not load search bundle". The browser requests /pagefind/pagefind/pagefind.js (a doubled pagefind/ segment) which 404s (served as text/html), so the dynamically imported module is blocked.

This affects shallow pages such as the site homepage; deeper pages happened to work, which masked the bug.

Root cause

The modal Component UI was configured with a page-relative bundle-path:

<pagefind-config bundle-path="{{{siteRootPath}}}/pagefind/"></pagefind-config>

The components load the index via a dynamic import(\${bundlePath}pagefind.js`)that executes **inside**/pagefind/pagefind-component-ui.js. A dynamic import()resolves relative specifiers against the **importing module's URL**, not the page. On shallow pagessiteRootPathis., so ./pagefind/resolves against…/pagefind/and doubles to…/pagefind/pagefind/pagefind.js`.

Verified against production:

URL Status
/pagefind/pagefind.js 200
/pagefind/pagefind/pagefind.js 404 (text/html)

Fix

Use an absolute, root-relative bundle-path="/pagefind/". It is depth-independent and matches Pagefind's documented convention (their examples use absolute paths; auto-detect also falls back to /pagefind/).

One-line template change; npm run lint passes on Node 22.

🤖 Generated with Claude Code

The Pagefind modal Component UI failed to load its search bundle on
shallow pages (e.g. the site homepage) with "Could not load search
bundle". The bundle was requested at /pagefind/pagefind/pagefind.js
(404, served as text/html) instead of /pagefind/pagefind.js.

Root cause: bundle-path was page-relative ({{siteRootPath}}/pagefind/).
The components load the index via a dynamic import(`${bundlePath}pagefind.js`)
that runs inside /pagefind/pagefind-component-ui.js, and import() resolves
relative specifiers against the importing module's URL, not the page. On
shallow pages siteRootPath is ".", so "./pagefind/" resolved against
.../pagefind/ and doubled to .../pagefind/pagefind/pagefind.js. Deeper
pages emitted an absolute /pagefind/ and worked, masking the bug.

Use an absolute, root-relative bundle-path="/pagefind/": depth-independent
and matching Pagefind's documented convention (their examples use absolute
paths; auto-detect also falls back to /pagefind/).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Signed-off-by: Thomas Müller <1005065+DeepDiver1975@users.noreply.github.com>
@DeepDiver1975 DeepDiver1975 merged commit 8b215f8 into master Jun 16, 2026
2 checks passed
@DeepDiver1975 DeepDiver1975 deleted the fix-pagefind-bundle-path branch June 16, 2026 12:44
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants