在浏览器页面有时看到sass文件而不是css文件问题，其主要由于sass开启了source-map(调试)功能，问题如下图：
sass调试
sass调试需要开启编译时输出调试信息和浏览器调试功能，两者缺一不可。
开启编译调试信息
目前sass的调试分为两种，一种为开启debug-info，一种为开启sourcemap（这个将成为主流）。
如开启的是debug-info，则解析的css文件中会有以@media -sass-debug-info开头的代码，如没有则表明没有开启。
如开启的是sourcemap，则在解析的css文件同目录下生成一个.css.map的后缀名文件。
命令行开启
两个的命令分别为--debug-info，--sourcemap，开启如下：
1 sass --watch style.scss:style.css --debug-info 2 sass --watch style.scss:style.css --sourcemap
koala开启
有关koala的使用请点击这个http://koala-app.com/index-zh.html
如下图：点击相应的文件，然后就会出现右边的编译选项，即可选择是否开启source map，debug info
开启浏览器调试
谷歌浏览器调试
F12打开调试面板，点击调试面板右上角的齿轮图标打开设置，在general选项中勾选Enable CSS source map 和 Auto-reload generated CSS。
开启--sourcemap编译，f12打开调试面板，就可以看到原先右边的css文件变成了我们现在的scss文件
点击scss文件，会跳到source里面的scss源文件，现在可以在里面进行修改，修改完成后可以右键选择save或save as命令，然后替换我们本地的scss源文件，刷新chrome就可以看到变化（注意，解析样式需要一定时间）。以后只要ctrl+s保存修改就可以在浏览器中看到修改效果了。
火狐浏览器调试
debug-info调试
firefox可以安装插件FireSass使用debug-info来调试。
开启--debug-info编译，f12打开firebug，就可以看到原先右边的css文件变成了我们现在的scss文件
sourcemap调试
firefox 29 将会开始支持sourcemap，注意是火狐自带的调试功能，而不是firebug。
开启--sourcemap编译，右键“查看元素”采用火狐自带的调试功能，打开调试面板，在样式上右键选择“显示原始来源”。
点击scss文件，这样就跳到了scss文件。如下图：
然后就可以进行我们的修改了，修改之后点击保存或者‘ctrl+s‘弹出我们要保存到哪里，同谷歌一样直接覆盖到我们本地的源文件就ok了。
有时用29 beta版本的时候这个功能不太稳定，估计到稳定版本应该就好了。同时期待FireSass这个插件升级支持sourcemap。