Jekyll/Liquid：在模板中内联包含已编译的SASS

出于性能原因，我希望将CSS内联到Jekyll生成的HTML文件中。我天真地尝试：

<style type="text/css">
  {% include main.scss %}
</style>

{%include main.scss%}

---

问题是，它包括源文件（仅定义变量并包含其他文件），而不是编译后的CSS。如何获取已编译的CSS？

Jekyll

scssify

过滤器以进行救援：

  <style type="text/css">
    {% capture sass_file %}
      {% include main.scss %}
    {% endcapture %}
    {{ sass_file | scssify }}
  </style>

{%capture sass_file%}
{%include main.scss%}
{%endcapture%}
{{sass_文件| scssify}

谢谢你的回答。不幸的是，

scssify

无法处理

@import

语句，这意味着我无法使用它，除非我想手动将所有文件合并到一个怪物中。它也不能处理

@charset

，虽然这不太可能是个问题，因为服务器将在头中发送正确的字符集。我刚刚测试了这个技巧，并且“它可以工作！”。如果您有任何要提交的存储库url，我可以查看您的代码。我再次尝试，发现问题是

scssify

无法处理与Jekyll front有关的文件。所以，问题解决了。有趣的是，开发构建的构建时间从2秒跳到了12秒。我想知道目前大约需要5分钟的生产构建会发生什么？