Skip to content

Pagefind fails when site is deployed with a non-empty baseUrl #2922

Description

@yihao03

Environment

  • MarkBind v7.2.1
  • GitHub Pages project site
  • Non-empty baseUrl (for example, /IT2900)

Description

Pagefind search fails on sites deployed under a subpath. The generated page defines the base URL as a top-level lexical binding:

<script>
  const baseUrl = '/IT2900'
</script>

However, packages/core-web/asset/js/pagefind-lazyloader.js reads it as a property of window:

const baseUrl = window.baseUrl || '';
const module = await import(`${baseUrl}/markbind/pagefind/pagefind.js`);

A top-level const does not create a window property. As a result, window.baseUrl is undefined, the fallback empty string is used, and Pagefind attempts to import from the domain root when the Pagefind <search /> UI is opened.

For a site with baseUrl: "/IT2900":

  • Actual request: /markbind/pagefind/pagefind.js (404)
  • Expected request: /IT2900/markbind/pagefind/pagefind.js (200)

The Pagefind assets are generated correctly at the expected subpath; only the lazy-loader import URL is incorrect.

Steps to reproduce

  1. Configure a MarkBind site with a non-empty base URL and Pagefind enabled:
{
  "baseUrl": "/example",
  "pagefind": {
    "enablePagefind": true
  }
}
  1. Add the Pagefind component <search /> to a page or layout. Note that <searchbar> is the separate legacy heading-search component and does not exercise this code path.
  2. Run markbind build.
  3. Serve _site so that it is available under /example.
  4. Open the Pagefind search UI.
  5. Observe that the browser requests /markbind/pagefind/pagefind.js instead of /example/markbind/pagefind/pagefind.js.

Suggested fixes

Either expose the generated value explicitly:

<script>
  window.baseUrl = '{{ baseUrl }}'
</script>

or have the lazy loader consume a value that is passed without relying on a window property.

Additional evidence

The issue is present in both the v7.2.1 generated output and the current master versions of packages/core/src/Page/page.njk and packages/core-web/asset/js/pagefind-lazyloader.js.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

      Milestone

      No milestone

      Relationships

      None yet

      Development

      No branches or pull requests

      Issue actions