Static adapter does not honor base path for static files

[Ghirigoro]

Describe the bug

1. Create a project with a static adapter.
2. Add this to the config: paths: { base: '/apath'}
3. Build the project
4. Preview the project
5. Note that any files in static folder are resolved at the root and ignore the base path. i.e. localhost:3000/img.png instead of the expected localhost:3000/apath/img.png

I would expect the base path to be honored across the board and not just for js/css files.

Reproduction

NOTE: I'm not sure if this is a bug or static files intentionally must always resolve to the root. If this is expected behavior I'll change this to a feature request, if it is indeed a bug then I will provide a repository highlighting the issue.

Logs

NA

System Info

System:
    OS: macOS 12.0.1
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 664.50 MB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 17.2.0 - /usr/local/bin/node
    Yarn: 1.22.17 - /usr/local/bin/yarn
    npm: 8.1.4 - /usr/local/bin/npm
  Browsers:
    Brave Browser: 93.1.29.80
    Chrome: 97.0.4692.71
    Firefox: 95.0.2
    Firefox Developer Edition: 82.0
    Safari: 15.1
  npmPackages:
    @sveltejs/adapter-static: ^1.0.0-next.23 => 1.0.0-next.24 
    @sveltejs/kit: next => 1.0.0-next.216 
    svelte: ^3.42.6 => 3.45.0

Severity

blocking all usage of SvelteKit

Additional Information

No response

[Ghirigoro]

Someone kindly pointed out on the discord chat that I can work around this issue by manually prefixing my file paths for things in static with the base path. For example:

<script lang="ts">
  import { base } from '$app/paths';
  //...
</script>
<img src={`${base}/my-static-file.svg`}/>

While a bit tedious it's fine if that's the intended approach, but it does break down in places where you don't have access to $app/paths - e.g. referencing font files in css, or favicons in html.

[benmccann]

@Ghirigoro can you set the assets option to be your domain + base directory as an easier workaround?

[benmccann]

Actually, I think this should be fixed by #3346

[lukaso]

This does not appear to be fixed. I've just run into this issue on version 1.25.1. The workaround from @Ghirigoro is working.

[lukaso]

My svelte.config.js:

const config = {
	preprocess: vitePreprocess(),

	kit: {
		adapter: adapter({
			fallback: 'index.html',
			pages: '../assets/console'
		}),
		paths: { base: '/console' }
	}
};

And my img tag:

Broken on production build but working when runing in dev vite dev:

<img src="/images/image.svg" />

Fixed:

<img src={`${base}/images/image.svg`} />

[fzakaria]

I am also running into this on SvelteKit 2.16.1

[ColeyG]

Broken in latest release