如何使用SASS解析.scss文件中所有CSS选择器的列表？

Question

我想以编程方式解析.scss文件,以生成该文件中使用的选择器的平面列表,主要作为一些静态代码分析的基础.

在SASS术语中,我正在寻找一种方法来获取Sass::Tree::RuleNode给定.scss文件的所有列表.

到目前为止,我正在使用Sass::Engine.for_file创建一个树.然后,根据文档,为了Sass::Tree::RuleNode.resolved_rules在我必须使用的各个节点上使用Tree::Visitors::Cssize.但在某处有一个(可能是简单的)错误.

require 'sass'

sass_engine = Sass::Engine.for_file('files/examples.scss',{
  :style => :compact,
  :load_paths => ['files'],
  :syntax => :scss,
})

tree = sass_engine.to_tree

Sass::Tree::Visitors::Cssize.visit(tree)

tree.each do |node|
  if node.is_a? Sass::Tree::RuleNode
    puts node.resolved_rules
  end
end

这是我得到的错误和堆栈跟踪:

ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:186:in `visit_prop': undefined method `empty?' for nil:NilClass (NoMethodError)
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:37:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:21:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:53:in `map'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:53:in `visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:30:in `block in visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:52:in `with_parent'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:29:in `visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:37:in `block in visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:201:in `visit_rule'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:37:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:21:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:53:in `map'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:53:in `visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:30:in `block in visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:52:in `with_parent'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:29:in `visit_children'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:37:in `block in visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:65:in `visit_root'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:37:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:21:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/base.rb:24:in `visit'
    ruby-1.9.3-p362/gems/sass-3.2.10/lib/sass/tree/visitors/cssize.rb:6:in `visit'

非常感谢提前.

Answer 1

我对 Sass gem 代码库不太熟悉，但能够通过遵循sass gem 文件中Cssizesass/tree/root_node.rb类的代码示例来使其工作（至少不会崩溃） ，该文件具有：

  # Runs the dynamic Sass code *and* computes the CSS for the tree.
  # @see #to_s
  def render
    Visitors::CheckNesting.visit(self)
    result = Visitors::Perform.visit(self)
    Visitors::CheckNesting.visit(result) # Check again to validate mixins
    result, extends = Visitors::Cssize.visit(result)
    Visitors::Extend.visit(result, extends)
    result.to_s
  end

将此代码片段应用到您的脚本中，我得到：

#!/usr/bin/env ruby

require 'sass'

sass_engine = Sass::Engine.for_file('files/examples.scss',{
  :style => :compact,
  :load_paths => ['files'],
  :syntax => :scss,
})

tree = sass_engine.to_tree

Sass::Tree::Visitors::CheckNesting.visit(tree)
result = Sass::Tree::Visitors::Perform.visit(tree)
Sass::Tree::Visitors::CheckNesting.visit(result)
result, extends = Sass::Tree::Visitors::Cssize.visit(result)
Sass::Tree::Visitors::Extend.visit(result, extends)

result.each do |node|
  if node.is_a? Sass::Tree::RuleNode
    puts node.resolved_rules
  end
end