Sass preprocessing for <style lang="scss">

[wfehrnstrom]

Forgive me if this is somewhat elementary, this is my first time using rollup and sass preprocessing together. An @use directive which I have included in my scss is not being recognized by the browser, leading me to think that the sass itself is not getting processed into CSS. I've followed the Readme in terms of setup, that is, my rollup.config.js looks like:

export default {
  client: ....
     plugins: [
      svelte({
          ....
          preprocess: {
        style: sass({
           includePaths: [
              // Allow imports from 'node_modules'
              join(__dirname, 'node_modules'),
           ]
         }, { name: 'scss' })
          }
      })] ...,
      // same thing for server (I'm using sapper)
}

and the rollup bundling phase completes without any errors. If my understanding is correct, sass(....) is a wrapper on underlying node-sass or sass, which does preprocessing work. I'm not quite sure what could be causing this inline scss styling not to be recognized, and would love some help. The code that is not functioning as intended is very short:

<style lang="scss">
  @use "@material/chips/mdc-chips"; 
</style>

Thanks very much.

[LukasHechenberger]

The @use directive is not supported with node-sass or sass, just dart sass... (See)

Sorry for the late response