如何在 Chrome Devtools 中进行 SASS 编辑？

Question

我只是按照这个 tutplus 教程来获取源地图 sass。

我在 chrome 中的检查元素下的实验选项卡中找不到对 sass选项的支持。被移除了吗？我迟到了使用这个功能吗？

我的 sass 版本是 3.3.8 (Maptastic Maple)

如何在 Chrome Devtools 中进行 SASS 编辑？

Answer 1

我成功了。SASS 支持不再是一项实验：它现在已成为一项标准。我只需遵循简单的步骤即可使其发挥作用。

1）在 chrome 上打开检查元素，然后单击右上角出现的齿轮图标。

2）启用CSS源映射（我认为默认情况下已启用。如果没有，请检查它。启用CSS源映射后不要关闭它。）

3) 单击左侧面板上“常规”选项卡正下方的“工作区”选项卡。

4) 单击“添加文件夹”按钮添加源代码文件夹（关闭该框。）

5) 进入“源”选项卡并找到您的 scss 文件。

现在您可以进行更改并按 ctrl+s，它会自动更改您的 style.scss。