Как использовать фильтр: sass в HAML на Ruby on Rails? - PullRequest
7 голосов
/ 12 июня 2010

Если вы используете HAML в Ruby on Rails, то у

: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>, но мы не хотим, чтобы мы генерировали css из sass, но не внутри тега <style> в файле HAML.

Ответы [ 3 ]

12 голосов
/ 12 июня 2010

Документация по вашему вопросу: здесь на haml-lang.com и более подробное объяснение на sass-lang.com .

Я считаю, что вам не хватает того, что sass не должен использоваться в ваших файлах haml. Они должны быть размещены в public / stylesheets / sass с расширением .sass. Они будут скомпилированы в файл .css в public / stylesheets, который вы затем добавите в свой макет.

Из ссылки sas-lang.com:

Например, public / stylesheets / sass / main.scss будет скомпилирован в public / stylesheets / main.css.

Затем вы должны использовать помощник stylesheet_link_tag (или связать таблицу стилей вручную):

<%= style_sheet_link_tag 'main' %>

Если вам действительно нужно использовать sass в haml, здесь - это ответ. Вы не можете вкладывать фильтры в хамл. По-видимому, вам нужно сделать что-то вроде этого:

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

Я полагаю, это было первоначальным ответом от групп Google haml.

10 голосов
/ 02 ноября 2012

Начиная с 4.0.0 ,

Фильтр :sass теперь упаковывает свой вывод в тег стиля, как и новые фильтры :less и :scss.

До 4.0.0 просто оберните его в %style:

%style
  :sass
    // so sassy! ;)
2 голосов
/ 23 июля 2011

Вы также можете написать собственный фильтр для создания тега стиля.

Пример ниже определяет новый фильтр ': 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
...