Nuxt3项目使用Sass时遭遇Undefined Mixin错误的求助

大家好，我正在开发一个Nuxt3项目，启动开发服务器时碰到了Sass混合宏未定义的报错，折腾了好一阵没找到根源，来求助各位大佬！

错误日志 #

➜ DevTools: press Shift + Alt + D in the browser (v2.5.0)
2:07:40 pm ℹ Re-optimizing dependencies because lockfile has changed
2:07:42 pm ✔ Vite client built in 130ms
2:07:42 pm ✔ Vite server built in 2158ms
2:07:44 pm ERROR Pre-transform error:
[sass] Error: Undefined mixin.
2:07:46 pm ╷
687 │ @include button;
│ ^^^^^^^^^^^^^^^
╵ ../../../../assets/styles/styles.amp.scss 687:9  @use
../../../../assets/styles/partials.scss 3:1  @use
../../../../assets/styles/globals.scss 4:13  root stylesheet
Plugin: vite:css
File: /home/rinkal/app/assets/styles/globals.scss:687:9
[sass] Error: Undefined mixin.
╷
687 │ @include button;
│ ^^^^^^^^^^^^^^^
╵ ../../../../assets/styles/styles.amp.scss 687:9  @use
../../../../assets/styles/partials.scss 3:1  @use
../../../../assets/styles/globals.scss 4:13  root stylesheet

从报错信息能看到，问题出在styles.amp.scss的第687行——我调用了@include button;这个混合宏，但Sass提示它未定义。

我的globals.scss文件代码 #

@use './partials/config/colors.scss' as *;
@use './partials/config/dimensions.scss' as *;
@use './partials/config/others.scss' as *;
@use './partials/config/responsiveness.scss' as *;
@use './partials/config/texts.scss' as *;
@use './partials/config/zIndexes.scss' as *;
@use './partials.scss' as *;
@use './partials/mixins/responsiveness.scss' as *;
@use './partials/mixins/fontsAndTexts.scss' as *;
@use './partials/mixins/linksAndButtons.scss' as *;
@use './partials/mixins/other.scss' as *;
@use "./globals/fonts" as *;
@use "./globals/thirdParty" as *;
@use './styles.amp.scss' as *;

我知道button这个混合宏是定义在linksAndButtons.scss里的，而且也通过@use引入了这个文件，但报错还是出现了。我猜测会不会是引入顺序的问题？因为我先引入了partials.scss，而它又引用了styles.amp.scss，这时候包含button混合宏的文件还没被引入，导致找不到定义？

有没有大佬能帮我排查下问题，或者给个解决思路呀？

内容来源于stack exchange