Imports in <style> section

[PlkMarudny]

I have troubles importing assets in the <style> section, for example:

@font-face {
    font-family: "Bloomberg Arabic Beta v4";
    src: url("./assets/fonts/BloombergArabicBetav4-Black.woff2") format("woff2"),
      url("./assets/fonts/BloombergArabicBetav4-Black.woff") format("woff");
    font-weight: 900;
    font-style: normal;
  }

What I see in the debug log:

vite:rewrite     "./assets/fonts/BloombergArabicBetav4-Black.woff" --> "/src/assets/fonts/BloombergArabicBetav4-Black.woff?import" +1ms
  vite:hmr         /src/App.svelte imports /src/assets/fonts/BloombergArabicBetav4-Black.woff +1ms

And later:

vite:history not redirecting /assets/fonts/assets/fonts/BloombergArabicBetav4-Black.woff (not accepting html) +3ms
  vite:rewrite (skipped) /assets/fonts/assets/fonts/BloombergArabicBetav4-Black.woff +3ms

While the browser requests:

GET http://localhost:3000/assets/fonts/assets/fonts/BloombergArabicBetav4-Black.woff2 net::ERR_ABORTED 404 (Not Found)

How to deal with such a situation?

[dominikg]

Hi,

current svite 0.8.1 still uses vite1 and resolving relative assets in the style declaration of svelte components may not be supported.
For fonts i recommend you put them in an extra css file and import that in your main.js. This way it should be picked up by vite1.

Unfortunately vite1 is deprecated and svite is not ported to vite2 yet. So for the time being what works in svite 0.8.1 works, broken things will only be worked on after porting has been done. Which should fix most/all outstanding issues because vite2 is a lot more awesome than vite1 already was. hth