无法将sass变量从一个scss文件导入到另一个

在我的React应用程序中，我有一个_variables.scss包含以下代码的文件。它包含我要在所有.scss文件中使用的变量：

$navy: #264653;
$green: #2A9D8F;
$yellow: #E9C46A;
$orange: #F4A261;
$red: #E76F51;

$title-font: "Arial Rounded MT Bold", sans-serif;
$text-font: "Raleway", sans-serif;

我想在另一个.scss文件中使用变量。这是我在另一个文件中的代码：

@use './design/variables' as v;

* {
  font-family: v.$text-font;
}

但是，我的React应用未识别变量，而是返回以下错误：

我已经检查过文件的路径是否正确。

如何解决此错误？