如何使用萨斯:: Engine的render_with_sourcemap

Question

看documentation for render_with_sourcemap后（不幸的是无法找到任何示例的这一使用），我的印象，下面应该工作：

@source_dir = './sass/' 
@target_dir = './css/' 
@output = Sass::Engine.new(File.read(@source_dir + 'style.scss'), { 
     cache_location: @source_dir + '.sass-cache', 
     style: :compressed, 
     syntax: :scss 
}).render_with_sourcemap(@target_dir + 'style.css.map') 

然而，错误我得到的是：

Error generating source map: couldn't determine public URL for the source stylesheet. (Sass::SyntaxError) 
No filename is available so there's nothing for the source map to link to. 

它的工作原理简单地使用呈现（它不需要参数），而不是render_with_sourcemap，所以我导致相信我的文件名是错误的 - 但是，我没有看到我做错了什么。我也尝试/style.css.map,./style.css.map和@target_dir + style.css.map，都没有成功（得到相同的错误）

Answer 1

看着source code of the Engine class，我发现如果@options[:filename]为零，则从_render_with_sourcemap引发错误 - 使用该选项初始化该功能导致成功生成源映射。

以下代码是生成用于将来参考的CSS文件和sourcemap所需的整个代码

@source = './sass/' 
@target = './css/' 
@output = Sass::Engine.new(File.read(@source + 'style.scss'), { 
    cache_location: @source + '.sass-cache', 
    filename: 'style.css', 
    style: :compressed, 
    syntax: :scss 
}).render_with_sourcemap(@target + 'style.css.map') 

# write css to file 
File.write(@target, @output[0]) 

# write sourcemap to file 
sourcemap_options = { 
    :css_path => @target, 
    :sourcemap_path => @target + 'style.css.map' 
} 
File.write(@target + 'style.css.map', @output[1].to_json(sourcemap_options)) 

Answer 2

即使没有记录，你应该设置文件名变量。之后你应该得到一个sourcemap对象。