我正在创建 Shopify 主题，并使用 LESS 将 Shopify 需要的样式表编译为 style.css.liquid。一切正常，我开始添加 lquid 过滤器和 if 语句。
当它位于 css 属性中时，我可以使用 Liquid 语法：
@brand-colour: ~"{{ settings.brand_colour }}";
h1{ color: @brand-colour;}
编译成如下内容：
h1 {color: {{ settings.brandcolour }};
这很好。
我不能做的是在没有像这样的 css 属性之前插入一个流动的语句：
{% if settings.full-bg %}
background-color: …
我试过逃避它
~"{% settings… %}"
乃至
@var: "{% if settings.full-bg %}"
然后运行
@{var}
但是我的编译器不喜欢它……</p>
有什么建议么？
如果有人感兴趣，我解决这个问题的方法是将我的 shopify / Liquid 内容放在评论中，如下所示：
/* {% if settings.repeating-pattern %} */
background: url(~"{{ 'repeating-pattern-header.png' | asset_url }}");
/* {% endif %} */
Shopify 对此表示敬意。
仅对于可能偶然发现此页面的其他任何人的信息，您实际上不需要处理这样的变量：
@brand-colour: ~"{{ settings.brand_colour }}";
h1{ color: @brand-colour;}
您实际上可以像这样使用SASS 插值来做到这一点：
h1 { color: #{'{{ settings.brand_colour }}'}; }
通俗地说，插值只是包装一个变量#{' '}，告诉 SASS 在编译 CSS 时将其输出为纯文本。
如果有人有兴趣使用 Sass 变量作为文件名和文件类型（例如自动生成 @2x 媒体查询的 mixin），代码如下：
background-image: url(#{'{{ "'}#{$filename}.#{$filetype}#{'" | asset_url }}'});