Additional Information
We now know how we can import static files, but there are a few details to keep in mind when doing so. Here’s a breakdown of the various items we still need to cover:
- Images versus Styles
- Customizing Imports
- File Paths
- SvelteKit Configuration Options
- Vite Configuration Options
Now let’s go over some important information about what went on behind the scenes with each of our imports.
Images versus Styles
When we imported an image in Chapter 2, we received the URL, which we then referenced in the src attribute of an <img> tag. When we imported the CSS file, we only needed to import it to apply the styles. This is because Vite is pre-configured to automatically inject the styles from CSS files into the component performing the import. Hence why the import was performed in the root +layout.svelte file. Vite also supports CSS @import and url() statements as well as CSS modules. CSS modules can be useful for...
