启用实时Sass DevTools实验

Question

我们如何在devtools启用实时sass？

以自己博客中的Umaar帖子为基础

https://umaar.com/dev-tips/103-live-sass/

Answer 1

<强>更新 再看一遍，似乎有一个新的实验性功能，显然在Chrome Canary中，我认为需要运行sass watch。但是，我无法真正找到启用它的位置。我留下原来的答案，因为它可能仍在使用。

这不再是实验性功能。在“设置”中，确保“启用CSS源地图＆＃39;启用并（可选）自动重新加载生成的CSS＆＃39;。

您可以将源文件添加为工作区并进行实时编辑：

另外，要在Chrome中启用实验性功能，请导航至chrome://flags/，启用Developer Tools experiments并重新启动Chrome。

在“设置”中，您会看到一个新的“实验”部分：

Answer 2

澄清“启用CSS源地图”仅允许您的浏览器显示scss和css之间的映射。现场SASS 仍然是实验性的特色。您可以通过在开发工具设置中的实验选项卡上按 SHIFT按钮六次来启用它。

我在Linux上使用最新的不稳定Chrome版本试了它，它似乎不起作用，所以你需要最新的Canary版本。

<强>更新

适用于Linux上的53.0.2763.0 dev版本。