font use absolute path assuming the font file will be hosted on the route.

[wighawag]

Describe the bug
in the create svelte default template the following css :

kit/packages/create-svelte/templates/default/src/app.css

Line 1 in 9a2cc0a

@import '@fontsource/fira-mono';

get generated into font with url referencing font woff file with absolute path. This assume the website is hosted on the root path

Expected behavior
The css generated for font file should use relative path. This should work nicely has relative path in css are relative to the css file itself

[Rich-Harris]

This is a Vite issue that will hopefully be fixed by vitejs/vite#7644

[iacore]

This is a Vite issue that will hopefully be fixed by vitejs/vite#7644

It is not that simple. While this simple site using vite works fine, svelte kit breaks this all.

Let's say I want to import a file with import("./import-me.css").

The website is generated at /build/index.html with adapter-static.

The browser tries to fetch /_app/assets/import-me-2d113d6b.css, which is wrong.

If I use base: "./" as vite config, then the browser fetches ./assets/import-me-2d113d6b.css which is /build/assets/import-me-2d113d6b.css, which is wrong again.

The correct path should be /build/_app/assets/import-me-2d113d6b.css.

[iacore]

Here's the website I was talking about (with instructions on dependencies):
https://github.com/locriacyber/svelte-relative-assets-challenge