设置SASS模块的正确方法是什么；图书馆；使用@use允许用户重写库变量？

随着@use和显式本地名称空间变量的移动，似乎为了覆盖Sass“库”变量，它最终会导致一些不好看的代码。这是预料之中的，还是我遗漏了一些东西，对Sass来说是比较新的

在此之前，有人将谨慎抛诸脑后，只是简单地创建了全局变量。 （是的，我知道@import还有几年的时间，但我对我的项目有兴趣。）

现在，由于@import已被弃用，我们应该转向@use

@use "_vars";
@use "vendor/cool_library";

我在搜索中看到的在“vendor/cool_library”代码中覆盖变量的唯一方法是在cool_library文件中添加@use./_vars，或者使用：

@use "vendor/cool_library" with ($varname: "var_data");

将我的vars文件添加到库中是不可能的，因为保持一个干净的子模块repo是一件痛苦的事情。这就结束了，剩下“with（）”选项作为唯一明显的方法

但是，对于某些库，这可能会导致类似的情况：

@use "vendor/cool_library" with (
        $line-height: 2.4rem,
        $global-radius: .2rem,
        $border-color: #bbb,
        $font-sans-serif: "Roboto", Helvetica, Arial, sans-serif !default,
        $font-serif: "Merriweather", Georgia, "Times New Roman", Times, serif,
        $font-monospace: Menlo, Monaco, Consolas, "Courier New", monospace,
        $font-base: $font-sans-serif,
        $font-color: #222222,
        $font-size: 22px ,
        $font-size--lg: 48px, 
        $font-size--md: 16px, 
        $font-size--sm: 14px, 
        $font-size--xs: 10px,
        . . . . And on and on... however many variables you need to override...
    );

在此基础上的一个变体是在此之前调用@use“\u vars”，但这只会使您能够使用来自_vars的内容设置那些with（）变量，并管理_vars文件中的变量内容。@use行仍然会像上面那样看起来一团糟

我曾希望，既然with（）想要一个映射，我就可以给它提供一个由映射组成的变量，但当我尝试它时，它似乎不起作用

或者，也可以使用mixin，但这会导致在您自己的Sass文件中重建像web框架这样的库，这是没有吸引力的

---

所以。。。我是否错过了一些明显的东西（真的希望如此）？或者这真的是@use modules的新方法吗？

不幸的是，您所指向的with（）方法似乎是唯一的方法。我首先尝试@use只使用_variables.scss文件，然后在with（）方法中设置修改后的变量，然后导入下面的scss项目的其余部分，希望这些变量能被考虑在内。但这并没有起作用，尽管它确实编译了

只有@使用node_modules/cool_css_framework/main.scss中的入口点文件，我才能修改变量，如您所示：

    @use './../../../node_modules/cool_css/main.scss' with (
      $link-color: #ffe88d,
      $link-color-hover: #fff0b4,
      $container-max-width: 1600px,

      $etc ...
    );

要使其正常工作，原始$variables必须设置为！默认标志：

$link颜色：绿色！违约

    @use './../../../node_modules/cool_css/main.scss' with (
      $link-color: #ffe88d,
      $link-color-hover: #fff0b4,
      $container-max-width: 1600px,

      $etc ...
    );