Sass @use 不能将单独的 mixin 文件处理成 master mixin 文件（ERR：未定义的 Mixin）答案

【问题标题】：Sass @use not working with separated mixin files into master mixin file (ERR: Undefined Mixin)Sass @use 不能将单独的 mixin 文件处理成 master mixin 文件（ERR：未定义的 Mixin）
【发布时间】：2020-09-16 22:27:10
【问题描述】：

我对 sass 比较陌生，但是当我学习它时，Sass 网站说要开始使用 @use 而不是 import，所以经过大量试验和错误后，我终于弄清楚了如何使用它与导入相同。

注意：我使用 Prepros 进行编译。

我在 mixins 文件夹中自己的文件中有这个 mixin：

// scss/mixins/_flex.scss

@mixin flex($flex-flow: row, $justify-content: center, $align-items: center) {
    display: flex;
    justify-content: $justify-content;
    align-items: $align-items;
    flex-flow: $flex-flow;
}

我在我的主要_mixins.scss 文件中尝试了@useing：

// scss/_mixins.scss

@use "mixins/flex" as *;

然后我尝试在另一个包含常见元素的文件中使用它：

// scss/_common_elements.scss

@use "mixins" as *;

.flex {
  @include flex();
}

然后我在 Prepros 日志中收到错误：Undefined Mixin，我在其中调用 @include flex(); 行（在 _common_elements.scss 内）

在我决定将 mixins 放在它们自己的单独文件夹中之前，它一直有效，但这与在 Bootstraps 源代码中的设置方式相同。

使用@use的整个过程真的很混乱。

有人知道我为什么会收到这个错误吗？

【问题讨论】：

标签： sass scss-mixins prepros

【解决方案1】：

我设法解决了它！

另外：如果您能帮我编辑这个问题/答案，以便用适当的语言更好地解释它，请发表建议，我会更新它。

在_mixins.scss 文件中，我需要使用@forward "mixins/flex" 而不是@use "mixins/flex" as *;：

像这样：

// scss/_mixins.scss 

@forward "mixins/flex";
@forward "mixins/overlay";
@forward "mixins/etc...";

我希望他们能在实际的sass @use documentation. 上更清楚地说明这一点

这里是actual docs to @forward.

【讨论】：

【解决方案2】：

要使用@use命令和sass的其他新特性，需要安装dart sass，而不是node-sass；

https://www.npmjs.com/package/sass

【讨论】：