在 Ruby on Rails 上的 HAML 中，如何使用 :sass 过滤器？答案

【问题标题】：In HAML on Ruby on Rails, how to use the :sass filter?在 Ruby on Rails 上的 HAML 中，如何使用 :sass 过滤器？
【发布时间】：2015-04-13 03:28:57
【问题描述】：

如果在 Ruby on Rails 上使用 HAML，那么

:sass
  #someDiv
    border: 3px dashed orange

它们周围不会有任何<style> 标签。

然后

:css
  :sass
    #someDiv
      border: 3px dashed orange

不会启动 :sass 过滤器，但是

:css
:sass
  #someDiv
    border: 3px dashed orange

将启动:sass 过滤器，但它位于<style> 标记之外。那么如何使用:sass 过滤器呢？我们可以手动将<style> 包裹在它周围，但我们希望从 sass 生成 css 而不是在 HAML 文件中的 <style> 标记内生成 css 的情况并不常见。

【问题讨论】：

标签： ruby-on-rails haml sass

【解决方案1】：

与您的问题相关的文档是 haml-lang.com 上的 here，更详细的解释是 sass-lang.com。

我相信您缺少的是不应在您的 haml 文件中使用 sass。它们应该放在 public/stylesheets/sass 中，扩展名为 .sass。它们将被编译成 public/stylesheets 中的 .css 文件，然后您将其链接到您的布局中。

来自 sas-lang.com 链接：

例如，public/stylesheets/sass/main.scss 将被编译为 public/stylesheets/main.css。

然后您将使用 stylesheet_link_tag 帮助器（或手动链接样式表）：

<%= style_sheet_link_tag 'main' %>

如果你真的需要在 haml 中使用 sass，here 就是答案。您不能在 haml 中嵌套过滤器。你显然需要做这样的事情：

%style(type="text/css") 
  :sass 
    div 
      color: red

我相信 this 是来自 haml google 群组的原始回复。

【讨论】：

hm...如果 sass 不应该在 haml 文件中使用，那么 sass 过滤器不应该存在？
它有它的用途，但使用外部样式表往往更易于维护和干燥。参考：stackoverflow.com/questions/1127927/…
Sass/scss 过滤器会很有用，例如将 404、422 和 500 作为页面打开单独的布局和缓存，因此部署时您只需以某种方式请求页面以获取静态 html 文件。我只是不喜欢写纯 CSS。
我的用例：一些基本样式应该可以在运行时由站点管理员编辑。我在数据库中存储了一堆变量，所有使用这些变量的样式都进入了一个 haml 部分。

【解决方案2】：

Since 4.0.0,

:sass 过滤器现在将其输出包装在样式标记中，新的 :less 和 :scss 过滤器也是如此。

4.0.0之前，只需将其包裹在%style：

%style
  :sass
    // so sassy! ;)

【讨论】：

【解决方案3】：

您也可以编写自定义过滤器来生成样式标签。

下面的例子定义了一个新的 ':csass' 过滤器。

require "haml/filters"
module Haml::Filters::Csass
  include Haml::Filters::Base
  include Haml::Filters::Sass
  lazy_require 'sass/plugin'
  def render(text)
    src = super
    "<style>#{src}</style>"
  end
end

所以你可以这样做:)

:csass
  #someDiv
    border: 3px dashed orange

【讨论】：