时间戳

首页 > 解决方案 > 配置之前使用过的转发模块时出现SASS错误

css - 配置之前使用过的转发模块时出现SASS错误

问题描述

我有两个模块。在第一个模块（module_a）中，我有一个用于变量的 CSS 和一个用于助手的 CSS。在助手中，我使用变量。当我尝试使用默认值转发 module_b 中的 module_a 时，我收到此错误：

Error: This module was already loaded, so it can't be configured using "with".

这里是我使用的文件：

/module_a/index.scss

@forward './styles/index';

/module_a/styles/_index.scss

@forward 'helpers';
@forward 'variables';

/module_a/styles/_helpers.scss

@use './variables';

/module_a/styles/_variables.scss

$color: black !default;

/module_b/index.scss

@forward '../module_a/index' with (
  $color: green,
);

我误解了 sass 的概念吗？我应该如何处理我的案子？

标签： csssass

解决方案

所以我的问题是 /module_a/styles/_index.scss 中的前锋顺序

我不得不改变

@forward 'helpers';
@forward 'variables';

至

@forward 'variables';
@forward 'helpers';

如 saas 文档https://sass-lang.com/documentation/at-rules/forward中所述

如果您确实在同一个文件中为同一个模块编写了@forward 和@use，那么首先编写@forward 总是一个好主意。这样，如果您的用户想要配置转发的模块，则该配置将在您的 @use 加载它之前应用到 @forward 而无需任何配置。

推荐阅读