Visual Studio Code SASS 编译器答案

【问题标题】：Visual Studio Code SASS compilerVisual Studio Code SASS 编译器
【发布时间】：2021-06-20 04:35:10
【问题描述】：

我从 Sublime 切换到 VS Code 因为它不再支持 PHP 和 SASS。我主要使用 CSS & SASS & JS & PHP。

我从VS Code documentation 设置了一个 SASS 编译器。如下：

// Sass configuration
{
  // See https://go.microsoft.com/fwlink/?LinkId=733558
  // for the documentation about the tasks.json format
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Sass Compile",
      "type": "shell",
      "command": "node-sass style.scss style.css",
      "group": "build",
      "problemMatcher": [
        "$eslint-compact"
      ]
    }
  ]
}

我测试它工作正常。 但我有两个问题：

首先，它着重于“style.scss”文件。我的意思是，无论我们在“.json”中提到什么。

其实我想要的是：专注于所有“.scss”文件而不搜索名称。

当我在“a.scss”编辑器打开的情况下运行编译时，它只编译“.json”文件中的名称。但是里面不包含“a.scss”！

其实我想要的是：如果我按下“CTRL + SHIFT + B”键并选择相应的选项，当前激活的编辑器就是“a.scss”编译。

这些有什么设置吗？

注意："command": "node-sass .scss .css", 会报错。

【问题讨论】：

我猜你想要像node-sass path/to/scss/folder/ -o path/to/css/folder/ 这样的东西。这可能不是 Visual Studio Code 特有的。另外，请注意 node-sass 不再处于活动维护状态。

标签： visual-studio-code sass node-sass

【解决方案1】：

实际情况是，SASS 实现为新版本Dart SASS。里面有@use之类的新规则...所以使用的编译器需要更新。

据我所知，到目前为止 Node Sass 没有。

在 VS Code 中使用 SASS 的更好方法是使用扩展。

因为我们有好几次：
有兴趣的可以看这里https://stackoverflow.com/a/66207572/9268485

注意：如果您决定使用其中一个扩展程序，您的设置可能会发生变化。查看扩展说明。

【讨论】：