SASS - 将 scss 文件引用到 main.scss 文件以更改 main.css

Question

我正在使用 SASS，并且我有不同的 scss 文件来描述我的网页布局，例如我的 _navbar.scss 和 _footer.scss 文件（还有不带下划线的 ma​​in.scss 文件）。

现在我想将我的所有布局 scss 文件引用到我的 main.scss 以便我的 main.css 将获得 main.scss 文件中引用的所有内容的样式。由于不再使用@import，有人知道该怎么做吗？我需要一些扩展或工具吗？

这是 HTML 代码。

<section class="navbar" id="nav">
            <ul>
                <li><a class="linkbox">Test</a></li>
                <li><a class="linkbox">Test</a></li>
                <li><a class="linkbox">Test</a></li>
                <li><a class="linkbox">Test</a></li>
            </ul>
    </section>


    <section class="footer">
        <div class="box">
            <div class="header">Footer</div>
        </div>
    </section>

这是我的文件夹结构。 Folder strucure

Answer 1

查看@use。

https://sass-lang.com/documentation/at-rules/use

@use 规则从其他 Sass 样式表中加载 mixins、函数和变量，并将来自多个样式表的 CSS 组合在一起。 @use 加载的样式表称为“模块”。 Sass 还提供了丰富的内置模块。