Allow aliasing to $lib in non-CSS stylesheets (Mainly for SvelteKit)

[d3rpp]

Is your feature request related to a problem? Please describe. I'm attempting to use a very dynamic component-based approach in order to create an internal package for styling components (a lot of scss files), however, I'm always finding myself in the testing version that shows all the components that I'm using ../ a lot in order to scope things

Describe the solution you'd like In SvelteKit, if you want to import a file from the lib directory you can just specify $lib/component and it'll be a directory relative to the lib folder. The idea being that the same can be done in preprocessed style blocks. e.g.

<style lang="scss">
    @use "$lib/button.scss" as button;
</style>

Describe alternatives you've considered At the moment, my solution is a lot of ../ repetitions in order to move around the file structure

How important is this feature to you? It is not overly important, it doesn't affect the programs using the component library, just the development of the library itself since it already works with the node resolver so I can just use

<style lang="scss">
    @use "common/button.scss" as button;
</style>

at the moment in the development of the component library, some of the stylesheets look like this

<style lang="scss">
    @use "../../../lib/button.scss" as button;
</style>

in place of it.

Additional context N/A

[dummdidumm]

I'm hesitant to add something like this because the job of svelte-preprocess is to be able to use other languages within the script/style/template, but not to enhance those languages with Svelte-specific features. Furthermore, if we start supporting $lib, people might expect this to work for all aliases defined in your config.

[bluwy]

Vite-specific, but maybe you can use useViteProprocess to have the SCSS pass through Vite's CSS pipeline