google-chrome - Chrome Canary Sass 调试在 scss 文件和编译后的 css 之间切换

Question

在为我的 scss 文件设置源映射，并为 canary 启动和运行 sass 调试之后，我遇到了一个小但令人沮丧的障碍。当我第一次加载或重新加载页面并检查元素时，我会在 Matched CSS Rules 窗口中获得对 .scss 文件的引用。截图 1。

当我去切换样式时，例如更改背景颜色，一旦我完成更改，文件路径立即更改为编译的 css 文件。屏幕截图 2.关于为什么会发生这种情况的任何想法？

Answer 1

实际上，当您修改 CSS 时，CSS 和 SCSS 之间的源映射被破坏，因为它不再正确。要恢复它，您应该将更新的 SCSS 保存到 DevTools Sources 面板中的磁盘上（sass 在监视模式下运行）并让 DevTools 重新加载您的 CSS。然后你的源映射会很好。