使用 Haml & Sass 与 Eclipse

Question

是否有任何 Eclipse 插件可以添加语法突出显示和其他编辑 Haml 和 Sass？谷歌搜索似乎只指向 lucky-dip.net 上的死项目。

注意：我最感兴趣的是 Sass。仅使用 Sass 的解决方案（或类似的东西，如 less ）在 Eclipse 中就可以满足我的需要。

另外，我正在使用 Eclipse 的 App Engine 插件为 Google App Engine (Java) 进行开发。因此，切换到另一个 IDE 并不是一个选择。

---

更新：所以我现在使用 帕斯卡的回答，我已经安装了 Ruby 和 Compass 将 sass 编译为 css。

不过我知道 sass 的语法将在 2.4 中发生变化 所以我仍然想让 Aptana 附带的 Haml 和 Sass 编辑器工作。当我尝试使用它们时，它们抛出异常并且不会显示文件。我很想知道这是因为我错误配置了 Aptana 还是编辑器中存在实际错误。

我也对与 Ecplise 集成的任何编译 Sass 的方式感兴趣，这样我就不必运行与它分开的东西。 （或者将 Sass/Compass 放入 Ecplise 构建过程中的一种方法。）

Answer 1

那么，Aptana 怎么样？根据 Haml/Saas 语法突出显示Aptana/Eclipse 博客文章：

最近，我一直在使用 Haml
我的一些 Rails 项目。它只是简单地
使您的视图清晰易读。
我遇到的一个问题是语法
在我最喜欢的 IDE 中突出显示，
Aptana Studio。 Haml 语法
突出显示支持已停止
不久前还有更多问题
在 Aptana 最近更新后提出。

经过一番研究，我发现了一个
Max Kostovetski 发布的解决方案
Haml Google 小组成员。现在，到
步骤：

1. 将以下文件下载到您的硬盘上：>
   • http://haml.googlegroups.com/web/haml_lexer.lxr< /里>
   • http://haml.googlegroups.com/web/haml.col< /里>
   • http://haml.googlegroups.com/web/sass_lexer.lxr< /里>
   • http://haml.googlegroups.com/web/sass.col< /里>
2. 从 AptanaEclipse“窗口”菜单中，选择“首选项...”
3. 在首选项窗口中，选择“编辑器”> “通用文本”
4. 按“添加...”添加新的文件扩展名：*.haml 和 *.sass
5. 对于每个新扩展，单击它并按“浏览...”即可
   选择正确的词法分析器文件 (*.lxr)
6. 要进行着色，请按“导入...”导入 *.col 文件
7. 按“确定”
8. 欣赏哈姆尔美景

PS ：请参阅原始博客文章，因为它提供了最新的链接。

注意：这也可以与 Aptana RadRails Eclipse 插件一起使用正如 Aptana Studio

更新： 在撰写本文时，RadRails 和 Studio 似乎支持 Haml 和 Sass，因此现在可能无需执行上述步骤。

---

要在 Eclipse 中以“集成”方式编译 SaaS，您可能只需使用外部工具（运行 > 外部工具）。另一个更详细的选项是将“程序生成器”添加到项目的生成器中，如下所示博客文章。当然，所描述的解决方案需要适应 Saas，但其背后的原则似乎适用。注意：我自己没有实现它，这只是一个想法，我什至不确定它是否有意义。

Answer 2

请注意，最新的 EclipseColorer 实际上支持 HAML 和 SASS。如果您不需要功能齐全的 Aptana IDE，而只是寻找一个编辑器，那么它可能是一个不错的选择。

EclipseColorer 还为您提供更好的语法 mixin 支持：HAML 内的其他语言的语法会突出显示（ruby、javascript、css，甚至 sass 的 mixin）。

Answer 3

虽然似乎还没有任何 HAML 或 SASS 语法突出显示，但您可能需要考虑通过一些可用的插件将 VIM（它确实支持 HAML 语法突出显示）引入 Eclipse。 Eclim 可能是一种可能性（尽管，我没有使用它 - 只是试图提供其他替代方案）。

另一种选择是采用现有的 Eclipse 语法突出显示插件并为 Sass 和/或 HAML 添加语法突出显示。像 Eclipse Colorer 这样的东西可能值得研究。

Answer 4

我知道这是一个老问题，但对于像我这样刚接触 SASS 和 Compass 的人来说，我刚刚安装了 Aptana Studio 3，它现在支持 .scss、.sass 和 .haml。享受。

Answer 5

Aptana 给我带来了太多问题，所以经过大量搜索（出现了这个线程），我发现
LiClipseText (https://marketplace.eclipse.org/content/liclipsetext)

这是一个插件除其他外，还为 SASS/SCSS 文件提供语法突出显示。它似乎可以工作，并且具有“语法突出显示（基于 LiClipse、TextMate 或 SublimeText）”，因此可能是相当可配置的（我没有太多使用它，但基本的语法突出显示功能对我来说很有效，这比Eclipse WST CSS 编辑器可以处理 SCSS 文件）。

它是商业 LiClipse 插件的开源编辑器组件 (https://marketplace.eclipse.org/content /liclipse）我没有使用过。

Answer 6

我发现 Igor 的答案中的 Colorer 插件很有趣，但我使用 .scss 文件扩展名，它仅适用于 .sass 文件。以下是如何使其支持 .scss 文件扩展名：

首先正常安装插件。在 Eclipse 的“帮助”菜单中选择“安装新软件”并添加以下存储库：http://colorer.sf.net/eclipsecolorer。现在选择这个存储库，您应该会看到 Eclipse Colorer 安装选项。据我所知，没有拖动安装选项。

安装后，转到 Eclipse 插件目录中的 Colorer 插件文件夹。就我而言，它是 eclipse/plugins/net.sf.colorer_0.9.9/。您必须修改 3 个文件：

• colorer/hrc/common.jar
• colorer/hrc/proto.hrc
• /plugin.xml

在执行以下任何操作之前，请备份文件夹中的所有文件以便恢复

修改common.jar

将common.jar 解压到一个空文件夹中。这可以像任何普通的 tar.gz 文件一样完成。解压后，您必须修改其中的 2 个文件：

复制 inet/haml.hrc 中的第 53 行和第 53 行，并将其更改为 scss。结果应如下所示：

<block start='/^((\s\s)*):(sass)/' end='/^\M (\s*$|\y1\s)?! /ix' region='def:Insertion' region01='def:Outlined'
    region00='def:PairStart' region10='def:PairEnd' content-priority='low' scheme='sass:sass'/>
<block start='/^((\s\s)*):(scss)/' end='/^\M (\s*$|\y1\s)?! /ix' region='def:Insertion' region01='def:Outlined'
    region00='def:PairStart' region10='def:PairEnd' content-priority='low' scheme='scss:scss'/>

现在将 inet/sass.hrc 复制到 inet/scss.hrc 并更改相关行。生成的 scss.hrc 应如下所示：

<?xml version="1.0" encoding='Windows-1251'?>
<!DOCTYPE hrc PUBLIC "-//Cail Lomecb//DTD Colorer HRC take5//EN"
  "http://colorer.sf.net/2003/hrc.dtd">
<hrc version="take5" xmlns="http://colorer.sf.net/2003/hrc"
     xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
     xsi:schemaLocation="http://colorer.sf.net/2003/hrc http://colorer.sf.net/2003/hrc.xsd">

  <type name="scss">

    <annotation>
     <documentation>
      SCSS Sassy CSS 
     </documentation>
     <contributors><![CDATA[
     Igor Russkih irusskih at gmail dot com
     ]]></contributors>
    </annotation>

    <region name="ClassSelector" parent="def:TypeKeyword"/>
    <region name="IDSelector" parent="def:Keyword"/>
    <region name="IncludeMixin" parent="def:Label"/>

    <scheme name='PropertyNames'>
      <regexp match="/(\$)([\w\d\-]+)/" region='def:Var'/>
      <inherit scheme='css:PropertyNames'/>
    </scheme>

    <scheme name="PropertyWrapper">
       <block start="/~/" end="/(:|\s|$)/" scheme="PropertyNames" region10="def:Symbol"/>

       <regexp match="/(\$)([\w\d\-]+)/" region='def:Var'/>

       <inherit scheme="css:Property"/>
    </scheme>

    <scheme name="scss">
       <!-- property value after colon -->
       <block start="/\M([\$\w\d\-]+)\s*(:)/" end="/\M([\x22\x27]|$)/"
              scheme="PropertyWrapper" region02="def:Symbol"
       />
       <block start="/(:)\s*\M([\w\d\-]+)?/" end="/\M([\x22\x27]|$)/"
              scheme="PropertyWrapper" region02="def:Symbol"
       />
       <regexp match="/^ \s* \M[\.\#\=\@\!] (?{def:Outlined}[\w\d\-]+ ) /x" />

       <regexp match="/ \. (?{ClassSelector}[\w\d\-]+ ) /x" />
       <regexp match="/ \# (?{IDSelector}[\w\d\-]+ ) /x" />
       <regexp match="/ [\=\+] (?{IncludeMixin}[\w\d\-]+ ) /x" />

       <regexp match="/[\(\)'"]/" region='def:Symbol'/>

       <regexp match="/\/\/.*$/" region='def:Comment'/>

       <regexp match="/\@(import|extend|mixin)/" region='def:Keyword'/>

    </scheme>

  </type>
</hrc>
<!-- ***** BEGIN LICENSE BLOCK *****
   - Version: MPL 1.1/GPL 2.0/LGPL 2.1
   -
   - The contents of this file are subject to the Mozilla Public License Version
   - 1.1 (the "License"); you may not use this file except in compliance with
   - the License. You may obtain a copy of the License at
   - http://www.mozilla.org/MPL/
   -
   - Software distributed under the License is distributed on an "AS IS" basis,
   - WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
   - for the specific language governing rights and limitations under the
   - License.
   -
   - The Original Code is the Colorer Library.
   -
   - The Initial Developer of the Original Code is
   - Igor Russkih <irusskih at gmail dot com>
   - Portions created by the Initial Developer are Copyright (C) 2010
   - the Initial Developer. All Rights Reserved.
   -
   - Contributor(s): 
   -
   - Alternatively, the contents of this file may be used under the terms of
   - either the GNU General Public License Version 2 or later (the "GPL"), or
   - the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
   - in which case the provisions of the GPL or the LGPL are applicable instead
   - of those above. If you wish to allow use of your version of this file only
   - under the terms of either the GPL or the LGPL, and not to allow others to
   - use your version of this file under the terms of the MPL, indicate your
   - decision by deleting the provisions above and replace them with the notice
   - and other provisions required by the LGPL or the GPL. If you do not delete
   - the provisions above, a recipient may use your version of this file under
   - the terms of any one of the MPL, the GPL or the LGPL.
   -
   - ***** END LICENSE BLOCK ***** -->

之后，在提取 common.jar 的文件夹中运行以下命令以重新创建 jar 文件：

jar cf common.jar *

然后用此文件替换原始 jar 文件。

其他文件

现在，在 /plugin.xml 第 37 行包含 scss 扩展：

extensions="xml,xsd,xsl,dtd,hrc,hrd,html,htm,xhtml,rhtml,erb,yml,haml ,sass,scss,css,asp,aspx,jsp,fo,svg,dbk,docbook,jhtml,jspf,php,php3,php4,phtml,sgm,sgml,shtm,shtml"

最后，重复第 200-203 行colorer/hrc/proto.hrc。结果应该如下所示：

<prototype name="sass" group="inet" description="SASS">
  <location link="jar:common.jar!inet/sass.hrc"/>
  <filename>/\.(sass)$/i</filename>
</prototype>
<prototype name="scss" group="inet" description="SCSS">
  <location link="jar:common.jar!inet/scss.hrc"/>
  <filename>/\.(scss)$/i</filename>
</prototype>

重新启动 eclipse 后，您应该可以看到 .scss 文件的语法高亮显示。