Add hot reload to imported SCSS files on SvelteKit

As we chatted about it on Discord, that would be very cool to have HMR on a global SCSS file for SvelteKit like that:

// $layout.svelte
<style lang="scss" global>
    @import "../style/style.scss";
</style>

Right now it doesn’t seem to hot reload the changes when changing an imported SCSS file.

[LeonardoBrandao]

I got it working by importing the svelte-preprocess in the svelte.config.cjs file and using it like this:

const sveltePreprocess = require('svelte-preprocess');
module.exports = {
	kit: {
		// other options
	},
	preprocess: sveltePreprocess()
};

[Easy-Cloud-in]

Svelte-Kit now use vite.js for packing, how to use scss config in vite.js?