NetBeans中的CSS预处理器

Question

假设我在NetBeans 7.4上有这个HTML5项目

myproject <---project folder
  |
  |-- public_html <---web root (the only visible in Projects tab)
  |     |
  |     |-- css
  |           |-- style.css
  |
  |-- scss
        |-- file1.scss
        |-- file2.scss
        |-- more
              |-- file3.scss

我希望以这样的方式配置NetBeans：当我保存 file1.scss ， file2.scss 和 file3.scss 时，它将所有这些文件编译成 style.css ，最好是缩小...

有可能吗？如果是这样，我应该在项目属性中写什么（见图）？

注意：在NetBeans中正确安装和配置了SASS

Answer 1

我通常有一个main.scss文件，我导入所有其他获得预处理的css文件。这实际上并不是将所有内容都放在一个文件中，但它允许您只在标题中包含一个文件。

/*  Import Media Queries and Print Styles */

@import "base.css";
@import "device.css";
@import "print.css";
@import "site.css";
@import "mq.css";
@import "grid.css";
@import "utils.css";

然后从我的html头部，我包含main.css文件，其中包含我需要的所有内容。

<!-- CSS -->
<link rel="stylesheet" href="css/main/main.css">

对于缩小的首选项，这是预处理器设置的一部分。通常在从命令行设置它时，watch命令将具有类似的样式标志，这会缩小css：

sass --watch style.scss:style.css --style compressed

在您的图片中，有一个名为Compiler Options的字段，此字段应用于向您的预处理器添加任何标记，例如，在您的情况下，您可以将--style compressed添加到此字段。< / p>

示例：

使用--style compressed来缩小css输出。另外还有--style compact＆amp; --style expanded。

我希望这会有所帮助。