如何在 SvelteKit 中预编译 SCSS？答案

【问题标题】：How can I precompile SCSS in SvelteKit?如何在 SvelteKit 中预编译 SCSS？
【发布时间】：2022-01-16 00:48:13
【问题描述】：

我正在尝试将 SCSS 添加到我的 SvelteKit 应用程序中。它在组件内工作；但是，当我将默认的 app.css 转换为 scss 文件并更新从基础应用程序的导入时，页面会加载 FOUC。

<script context="module">
    import '../app.scss'; // Changed from .css
</script>

有没有办法让 SvelteKit 像处理标准 CSS 文件一样预编译样式并内联它们？

【问题讨论】：

【解决方案1】：

您可以改用 SCSS 导入：

<style lang="scss" global>
    @import '../app';
</style>

如果您要导入全局布局样式表，则必须使用 global 关键字。如果您忽略它，则导入的样式将作用于您的组件。

【讨论】：