Sass@use未加载部分

我正在尝试导入sass部分（_variables.scss）以在主样式表（global.scss）中使用，但是我一直Error: Undefined variable.在进行sass编译。

目录结构：

app
??public
  ??styles
    ?  global.css (output for sass compiling is here).
    ??sass
      ??_variables.scss
      ??global.scss

_variables.scss

$font-text: 'lato', sans-serif;

global.scss

@use '_variables';

body {
  font-family: $font-text;
}

查看Sass文档，我理解使用@use代替@import（有效），因为他们正在逐步淘汰它。

我在这里做错了什么？谢谢。

那是因为您没有使用支持此功能的Dart Sass。

同样在文档中，您将找到：

当前仅Dart Sass支持@use。其他实现的用户必须使用@import规则。

因此，@import直到@use支持使用。

顺便说一句，如果您想使用Dart Sass，请在Webpack配置中使用sass代替node-sass并要求它，例如：

// ...
{
  loader: 'sass-loader',
  options: {
    implementation: require('sass')
  }
}
// ...