scss-bundle 错误:@use 规则必须在任何其他规则之前编写

Wol*_*359 5 sass

我有这样的文件结构:

---- _base-map.scss
---- _child-map-1.scss
---- _child-map-2.scss
---- _child-map-3.scss
styles.scss
Run Code Online (Sandbox Code Playgroud)

style.scss 导入所有子地图文件:

@import './base-map';
@import './child-map-1';
@import './child-map-2';
@import './child-map-3';
Run Code Online (Sandbox Code Playgroud)

到现在为止还挺好。

_base-map.scss :

$base-map : (
    "font-size"                 : 1.3rem,
    "border-radius"             : 0.4rem,
    // ...
);
Run Code Online (Sandbox Code Playgroud)

为了使用“map.merge”,必须包含@use“sass:map”:

_child-map-1.scss :

@use "sass:map";
$child-map-1 : map.merge(
    $base-map,
    (
            "font-size"                 : 2rem,
            "border-radius"             : 0.5rem,
    // ...
    )
);
Run Code Online (Sandbox Code Playgroud)

但是,当我尝试将文件与 scss-bundle 捆绑在一起时,出现此错误:

[17:22:37] erro: There is an error in your styles:
[17:22:37] erro: @use rules must be written before any other rules.
[17:22:37] erro:     ?
[17:22:37] erro: 838 ? @use "sass:map";
[17:22:37] erro:     ? ^^^^^^^^^^^^^^^
[17:22:37] erro:     ?
[17:22:37] erro:   stdin 838:1  root stylesheet on line (838, 1)
Run Code Online (Sandbox Code Playgroud)

当我不包含 @use "sass:map" 时,scss 编译器会抱怨 map.merge。

解决这个问题的正确方法是什么?

Wol*_*359 -2

我必须将“map.merge”更改为“map-merge”才能使其正常工作。

感谢@Arkellys。

HTH某人。

  • 这不是解决方案,而是解决方法 (4认同)