SCSS: @use, @forward: Cannot use modules and access it's members

[Rolanddoda]

Version

15.9.1

Reproduction link

https://github.com/Rolanddoda/scss-syntax-issue

Steps to reproduce

I have a _list.scss file:

@mixin heading-style {
  background: blue;
  color: white;
}

A main.scss file:

@forward "list";

And in App.vue

<style lang="scss">
@use "scss/main";

h1 {
  @include main.heading-style;
}
</style>

What is expected?

On h1 element should be applied the css of the heading-style mixin.

What is actually happening?

I am getting a syntax error:

./src/App.vue?vue&type=style&index=0&lang=scss& (./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader/lib/loaders/stylePostLoader.js!./node_modules/postcss-loader/src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/App.vue?vue&type=style&index=0&lang=scss&)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Invalid CSS after "  @include main": expected "}", was ".heading-style;"
        on line 17 of C:\Users\rolan\Desktop Non OneDrive\Coding\Projects\scss-syntax-issue\src\App.vue
>>   @include main.heading-style;

   -----------^

[haoqunjiang]

https://sass-lang.com/documentation/at-rules/use

Only Dart Sass currently supports @use. Users of other implementations must use the @import rule instead.

npm uninstall node-sass
npm install sass

[orionrush]

See node-sass issue 2886.