sass - Jekyll:在 SCSS 部分中使用 _config.yml 中的值

Question

在我的 Jekyll 项目中，我的 _config.yml 中有以下内容文件:

colors:
  - name: red
    hex: '#FF0000'
  - name: yellow
    hex: '#FFFF00'
  - name: blue
    hex: '#0000FF'

在 assets/css/colors.scss ，我想为颜色创建类，如下所示:

{% for color in site.colors %}
.{{ color.name }} {
  color: {{ color.hex }};
}
{% endfor %}

我要 @import colors.scss文件到 main.scss ，但是当我这样做时，我收到以下错误:

Error in _assets/css/background-test.scss:6 Invalid CSS after "}": expected selector or at-rule, was "{% for color in..." 
  Liquid Exception: Invalid CSS after "}": expected selector or at-rule, was "{% for color in..." in _includes/head.html, included in _layouts/default.html
jekyll 3.0.1 | Error:  Invalid CSS after "}": expected selector or at-rule, was "{% for color in..."

有没有办法让 Liquid 处理来自 _config.yml 的值SCSS 部分中的文件？

Answer 1

Jekyll 只会解析您的 main.scss。

一旦用 Liquid 解析，它就会被传递给 sass/scss 处理器。因此，Liquid 不会解析任何@imported 文件。