-
-
Notifications
You must be signed in to change notification settings - Fork 2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Docs around loading fonts and global CSS imports #1619
Comments
If this does go through and is approved, please do tag me in the PR. I'll happily review the content and link the final page in the Guides section of the Fontsource docs since I've never personally worked with Svelte but still wish to support the community. |
@mvolfik thanks, this got me unstuck. Although When doing so in my case SvelteKit was preserving the Should I report this separately as a bug do you think, or am I doing something wrong? |
If you had the font files in the |
@mvolfik, while we wait for the maintainers to take a look at this issue, do you think it'll be alright to just post a dedicated guide directly in the Fontsource docs itself? It would then be pretty easy to copy and paste or link it in the Svelte docs in the future. |
This might be in line with the initial comment, but here's my situation. In my main However, I also have some routes located inside some route subfolders. The bad font appears in all pages (or components) that get opened from a subfolder route. Hopefully there something useful in this for all of you. |
I encountered the same problem. The browser reported an error as The reason for my error is that I set the After I changed the relative path to the absolute path, that is, Maybe you are not encountering this problem, but I still hope that other new users of sveltekit who encounter similar situations can receive a little help. |
Just dropping a request that since even now there isn't much concrete documentation on importing Fontsource into Svelte (first Google search leads to this issue), I'd love it if someone could assist in writing up some documentation for it in fontsource/fontsource#443! I don't really know much about Svelte to actually work on it myself, unfortunately. 😓 |
This thread helped me a lot to set-up Fontface w/ Material Icons: thanks! The first google search lead, indeed, is this page. |
I just went through a quite painful setup of fonts for my project - first I was trying to include font files manually from google webfonts helper. But the
@font-face
definitions were being removed somewhere during css optimization in build. I ended up looking into the example project, where I discovered that fontsource exists, and that fonts are loaded withimport "../app.css"
, which I didn't find documented anywhere. Also I faced another issue with using fontsource customizable sass mixins, as the referenced files weren't being loaded from the tilde path so I had to override$fontDir: "@fontsource/#{Roboto.$fontId}/files"
I'll be very happy to contribute docs for all of this to avoid this pain for others in the future, but first I'd like to check if there's a best practice established, get some info about importing css files in js, and where actually to put this so the docs page doesn't grow infinitely with various best-practices and tips
The text was updated successfully, but these errors were encountered: