Paraglide URL-based localization in combination with sveltekit paths.base

[ciddan]

What is the correct way to use paraglide for i18n in a sveltekit app that has a base path set? I've found paraglide's documentation on base paths, which works, with one significant drawback. I can no longer use resolve() from $app/paths in combination with localizeHref from $lib/paraglide/runtime. The base path gets inserted twice. We could abandon use of resolve, but like the type safety it provides.

Is there official guidance of what to do in this scenario?

[cookesan]

The double base means both helpers are owning the base path.

SvelteKit's resolve() already prefixes config.kit.paths.base. Paraglide can also include a base path in its urlPatterns, in which case localizeHref() returns a base-prefixed URL. Those two approaches should not be composed blindly.

Pick one owner:

<!-- SvelteKit owns the base path -->
<a href={resolve(localizeHref('/about', { locale }))}>About</a>

In that setup, keep Paraglide's localized paths app-relative and do not include the SvelteKit base in Paraglide patterns.
Also make sure the value passed to resolve() is an internal absolute path or route ID. Recent SvelteKit source rejects non-absolute/external inputs there.

Or:

<!-- Paraglide patterns own the base path -->
<a href={localizeHref('/about', { locale })}>About</a>

In that setup, do not wrap the result in resolve().

The Paraglide SvelteKit docs show resolve(localizeHref(...)), but that assumes localizeHref() is returning an unbased app path. If you also configured Paraglide patterns with the deployment base, SvelteKit will add the same prefix again.