我在OSX上,我希望能够使用new source maps feature在Chrome(或Canary)开发人员工具中调试Sass生成的CSS.我正在使用Sass和Compass.

我已经按照instructions来获取Sass产生的源映射文件.为了任何正在努力解决这个问题的人的利益,步骤是：

>使用sudo gem install sass –pre安装预发布版本的Sass
>检查你的指南针版本 – 你需要12.2,而不是13 alpha.如果你需要卸载它,你可以使用sudo gem uninstall compass –version 0.13.alpha.2.
>将其添加到config.rb文件中sass_options = {：sourcemap =>真正}.
>转到包含config.rb的文件夹并运行sass –compass –sourcemap –watch scss：css(这告诉Sass将scss文件夹中的文件编译为css文件夹中的CSS文件).

如果一切正常,当你在我们的一个scss文件(比如styles.scss)中进行更改时,Sass将编译一个新的CSS文件 – 同时它将创建一个名为styles.css.map的文件,其中包含在开发人员工具中选择元素时,应该允许Chrome将您指向源SCSS文件的映射信息.

我成功地让我的Sass生成了这个文件.但不幸的是,Chrome拒绝对它做任何事情.我已经完成了建议的步骤：

>安装Chrome Canary
>转到chrome：// flags并启用“启用开发人员工具”设置
实验”
>打开Web开发人员工具(功能-12),单击窗口右下角的齿轮
并在常规选项卡上勾选“启用源地图”和
实验选项卡勾选“支持Sass”.
>重启金丝雀

但是,当我检查开发人员工具中的一个元素时,我只是得到了与粗糙的CSS文件相同的旧引用.我想看看元素的样式在SCSS文件中的起源.有人在Chrome OSX上,甚至FireSass都有运气吗？