Updating SASS

[orangecoloured]

After the recent update of the sass package I started to get these warning while building my app.
Deprecation Warning: The legacy JS API is deprecated and will be removed in Dart Sass 2.0.0.

I updated vite.config.ts like this, but still getting the warning.

css: {
  preprocessorOptions: {
    sass: {
      api: 'modern'
    }
  }
}

How do I fix this?

[mojoaxel]

For me this stack-overflow answer solved this problem:

The default API when using Vite is currently set to legacy, but you can change it in your vite.config.[js/ts].

export default defineConfig({
 css: {
   preprocessorOptions: {
     scss: {
       api: 'modern-compiler' // or "modern"
     }
   }
 }
})

Reference: https://vitejs.dev/config/shared-options#css-preprocessoroptions

https://stackoverflow.com/a/79003101/722162 (CC-BY-SA by hiws)
Tested with svelte@4.2.19 and vite@5.4.8.

[orangecoloured]

Oh, wow. For some reason the first time I tried it, it didn't work. Now it worked on the first try.
Thanks!

[cheekybuddha]

Property:
sass vs scss
🤓😂

[mojoaxel]

@farhansadikgalib Please stop spamming other projects. This is not appreciated!