WebStorm的文件监视器用Dart编译SCSS

Question

我发现Sass正在从使用Ruby编译成Dart，正如他们的主页建议的那样 - https://sass-lang.com/。我按照那里的步骤，得到了自己的Dart编译器，实际上我可以运行他们建议的命令 - sass source/stylesheets/index.scss build/stylesheets/index.css并成功将我的SCSS编译为CSS。

我遇到的问题是当我尝试使用WebStorm的文件监视器为我执行此步骤时。当我配置文件观察器时，如下图所示：

然后在更改我的SCSS文件时，文件监视器确实触发了，但是说：

  

C：\ tools \ dart-sdk \ bin \ dart.exe --no-cache --update viewQuestions.scss：viewQuestions.css   无法识别的标志：缓存，更新

     

处理完成，退出代码为255

我尝试删除标记，但它会导致更多错误，所以我不再尝试了。然后我放弃了用Dart做它并用Ruby重新配置它的想法，使用相同的参数，如下图所示，它完美地工作。

所以我的问题是我做错了什么，是不是Dart需要不同的论点，或者我错过了更多的东西。

Answer 1

正如LazyOne建议的那样，我已经通过以下步骤找到了解决问题的方法：

1）运行“where sass”命令，找到sass.bat所在的位置

2）将该sass.bat传递到WebStorm文件监视器的 Program 字段中。它在这里 C：\ ProgramData \ chocolatey \ lib \ sass \ tools \ sass.bat

3）然后我跟着https://www.java.com/en/download/help/path.xml并将 C：\ tools \ dart-sdk \ bin 中的Dart bin文件夹添加到Win10 PATH 系统环境变量

4）最后，通过一些调整发现在File Watcher的Argument字段中，该行应为$ FileName $ $ FileNameWithoutExtension $ .css，中间没有“：”，与Ruby不同

这最终对我有用

Answer 2

您实际上不需要下载单独的Dart SDK，因为Sass安装程序提供了一个。

好像你已经关注了installation instructions，现在可能已经在c:\tools\dart-sass安装了Sass for Windows，所以你现在有了一个名为c:\tools\dart-sass\sass.bat的文件

这是您应该在Tool to run on changes | Program字段中添加到WebStorm的内容（替换c:\tools\ruby....bat行）。

Answer 3

添加正确答案后，删除“参数”字段中的--no-cache对我来说是有效的。

Answer 4

添加到正确的答案：对于那些是mac用户但尚未弄清楚的人，这对我有用：

1. 安装dart sass instructions here（注意：您可能要先卸载ruby sass：sudo gem uninstall ruby）
2. 验证dart sass是否正常工作：sass path_to_file/your_sass_file.scss path_to_file/your_output_file.css
3. 在Webstorm文件监视程序选项中，将“程序”引用设置为：usr/local/bin/sass（这是默认情况下为我安装sass的位置）
4. 对于“参数”，您可以使用：$FileName$ $FileNameWithoutExtension$.css（--update参数也可以，但是--cache argument被dart sass接受）