baseUrl not applied to images

[jphastings]

If I'm searching through multiple sites (on multiple domains), and the sites contain relative hrefs, then I'll need to specify the baseUrl in the mergeIndex, like this:

new PagefindUI({
  element: '#search',
  mergeIndex: [{
    bundlePath: 'https://www.byjp.me/search',
    baseUrl: 'https://www.byjp.me/',
  }]
})

This correctly updates the links for the search hits to point to (in this case) https://www.byjp.me/path/to/result (rather than https://search.example.com/path/to/result), but if there's a relatively referenced image the baseUrl doesn't apply, and broken images are shown, pointing to eg. https://search.example.com/path/to/result/image.jpg (rather than https://www.byjp.me/path/to/result/image.jpg, where the image actually is.)

A screenshot of this happening on my site (with pagefind 1.0.4)

[bglw]

Ah, good call. I'll look into this.

[jphastings]

Hey @bglw, did you have any luck? If you can point me in the right direction I'll be happy to try for a patch/PR myself 😊

[bglw]

Hey @jphastings — nothing on my end yet, but happy to point you in a direction 😄

Images in Pagefind just come through the generic "metadata" channel, which we don't necessarily want to mutate (some urls may not need the baseurl applied) so this is probably best fixed at the very end when rendering the content.

So that would just be the default UI svelte component(s) — i.e. result.svelte and result_with_subs.svelte will want to add a baseURL to their img tags if it seems required.

The contributing guide is also up to date (i hope) with the dependencies and commands for the UI packages :)