eclipseide和Sass

我最近开始使用EclipseIDE进行web开发

过去我用童子军来掩饰我的无礼

Eclispe中是否有自动编译我的Sass的方法

这是最好的选择吗

我已经试过了，但是我得到了一个构建失败，因为

<apply dest="css" executable="/var/lib/gems/1.9.1/bin/sass">

---

我意识到可执行文件需要指向我的系统上的sass，但我如何找到我的系统上的sass？

我最近在这里发布了相关信息：

我的帖子提到了OSX，但它应该很容易适应其他设置的过程。 以下是我帖子中的文字：

---

准备

1.确保安装了Ruby。你需要这个，因为SASS是一个ruby应用程序。默认情况下，OSX应该安装Ruby。要进行检查，请打开终端窗口并输入：

ruby -v

这将显示版本信息，如：

ruby 2.0.0p481 (2014-05-08 revision 45883) [universal.x86_64-darwin14]

/Users/myusername/.rvm/gems/ruby-2.1.5/bin/sass

如果您没有Ruby，请立即安装。等你弄明白了再来

如果您有时使用Ruby进行开发，您可能会使用RVM来管理不同的Ruby版本。如果您使用RVM，我们需要采取一些预防措施。别担心——我们不需要摆脱RVM。我们只需要确保将SASS安装到Ruby的系统版本

让我们检查一下是否安装了RVM：

rvm -v

rvm list

如果我们得到版本信息，那么我们有RVM。（如果没有，我们可以继续下面的步骤2。）让我们看看我们安装了哪些版本的Ruby：

rvm -v

rvm list

这将向您显示一个Ruby版本列表，以及相关信息。关于默认版本和当前版本。我们希望将SASS安装到Ruby的OS X默认版本，而不是RVM安装版本，因此请输入以下内容：

rvm use system

现在再次检查我们当前的Ruby版本：

ruby -v

好的，如果我们很高兴拥有Ruby并且使用OSX默认的Ruby，那么让我们继续

2.安装SASS

我们有没有无礼的行为

sass -v

如果未返回版本信息，则需要安装SASS：

gem install sass

如果出现权限错误，请使用sudo：

sudo gem install sass

安装SASS后，让我们检查一下它的位置：

which sass

这应返回：

/usr/bin/sass

如果返回了不同的路径，请再次查看上面有关RVM的信息

好的，现在我们已经在OSX默认版本的Ruby中安装了SASS，如果需要的话，我们现在可以通过RVM切换回不同版本的Ruby

---

在Eclipse项目中设置生成器

在Eclipse中，我们将使用构建器来设置SASS自动编译。 Ctrl键单击Explorer视图中项目的标题（在本例中，我正在处理一个PHP项目，所以我使用的是PHP Explorer视图）

选择属性

点击Builders，然后点击New…创建一个新的Builder

选择程序选项并单击确定

现在我们可以给构建器起个名字，例如sass.compiler

在主选项卡中，我们需要输入已安装sass应用程序的路径：

/usr/bin/sass

注意：如果您将SASS与安装了RVM的Ruby一起使用，此时您可能会尝试输入以下内容：

ruby 2.0.0p481 (2014-05-08 revision 45883) [universal.x86_64-darwin14]

/Users/myusername/.rvm/gems/ruby-2.1.5/bin/sass

但是，这会带来问题，因为SASS随后尝试查找所需的资源，但它们不在路径中，因此操作失败并出现错误：

sass env: ruby_executable_hooks: No such file or director

因此，需要将SASS安装到Ruby的OSX默认版本中

现在，我们需要将适当的参数传递给SASS，以便它知道要做什么以及要使用哪些文件。如果我们从命令行运行SASS，我们可能会在开发会话开始时执行以下操作：

sass --watch sourcefolder:destinationfolder

在实际项目中，可能看起来像这样：

sass --watch app/sass:public/stylesheets

这是一个一次性命令，每当对scss文件进行更改时，它会强制将

app/sass

中的任何scss文件编译为

public/stylesheets

中的css文件。但是，我们希望构建器在每次保存scss文件时触发编译过程，因此--watch是不合适的

如果我们进入：

sass --help

我们发现我们想要的选项是

--update

。幸运的是，这就像

--watch

一样，它递归地检查指定的文件夹——因此，如果我们有许多包含scss文件的文件夹，我们只需指定一个公共父文件夹。 您可能有一些要包含到其他scss文件中的scss文件，不应编译到它们自己的css文件中。如果是这种情况，请在开头用下划线重命名这些文件，例如，将

mixins.scss

重命名为

\u mixins.scss

Sass仍将识别这些文件以供包含，但不会编译css等价物

在我的参数字段中，我有：

--update ${workspace_loc:/project1/htdocs/theme}:${workspace_loc:/project1/htdocs/theme} --sourcemap=none --style compressed

在我的例子中，scss文件与编译的css文件位于同一文件夹中，因此我的源文件夹和目标文件夹是相同的。我使用其中一个表单字段中的浏览工作区按钮为源文件夹和目标文件夹生成

${Workspace\u loc}

占位符值。 我还添加了几个SASS选项–一个用于关闭.map文件的生成，另一个用于以压缩样式输出css

在构建选项选项卡下，我勾选了

分配控制台

和

自动构建期间

，但没有其他内容

单击OK完成

现在，当我编辑

project1/htdocs/theme

文件夹中的一个scss文件时，在Eclipse控制台视图中，我看到SASS正在执行它的工作，将scss编译成css。成功

---

替代方法

---

使用；）

一个简单的解决方案是使用Eclipse Wild Web Developer：

---

该编辑器将简化使用web技术的开发。除了自动将SCSS文件编译为CSS文件外，它还提供了更多功能。看看吧，我想你会喜欢的。

你正在运行什么版本的Sass？Sass 3.3需要Ruby 1.9.3。我正在运行Sass 3.2.14我正在学习Saas。希望在eclip中轻松使用它