使用Svelte和Vite导入外部sass或scs变量

Question

我创建了一个具有各种颜色的大型sass样式表。根据vite的sass指南，我在组件中使用了sass。现在我也想在Svelte组件的样式表中使用这些外部变量。

到目前为止，我已经尝试过：

@use "./test.sass" // along with "./test"
p {
color: $testColor
}

以及

@import url("./test.sass") // along with "./test"
// ... same as above

它给我一个错误Error: Undefined variable。我的变量在test.sass 中定义正确

Answer 1

@use将导入的变量封装在命名空间中，因此您必须明确声明这些变量来自模块，而不是$testColor。

@use "./test.sass"
p {
color: test.$testColor
}

或

@use "./test.sass" as *
p {
color: $testColor
}