在 Eclipse 中使用 Haml 和 Sass
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1474096/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using Haml & Sass with Eclipse
提问by Sam Hasler
Are there any plugins for eclipse that add syntax highlighting and other niceties for editing Hamland Sass? Google searches only seem to point to a dead project on lucky-dip.net.
是否有任何 eclipse 插件可以添加语法突出显示和其他用于编辑Haml和Sass 的细节?谷歌搜索似乎只指向lucky-dip.net 上的一个死项目。
Note: it's Sass I'm most interested in. A solution for using just Sass (or something similar to it like less) in Eclipse would suit my needs.
注意:我最感兴趣的是 Sass。在 Eclipse 中只使用 Sass(或类似的东西,如less)的解决方案将满足我的需求。
Also, I'm developing for Google App Engine (Java), using the App Engine plugin for Eclipse. So switching to another IDE isn't an option.
此外,我正在使用适用于 Eclipse 的 App Engine 插件为 Google App Engine (Java) 进行开发。所以切换到另一个 IDE 不是一种选择。
Update:So I've got syntax highlighting now using Pascal's answerand I've installed Rubyand Compassto compile sass into css.
更新:所以我现在使用Pascal 的答案进行了语法高亮显示,并且我已经安装了Ruby和Compass来将 sass 编译成 css。
However I'm aware that the syntax of sass will be changing with 2.4so I'd still like to get the Haml and Sass Editors that come with Aptana to work. When I tried to use them they threw an exception and wouldn't display the files. I'd be interested to know if that's because I misconfigured Aptana or is an actual bug in the editors.
但是我知道sass的语法将随着 2.4 发生变化,所以我仍然想让 Aptana 附带的 Haml 和 Sass 编辑器工作。当我尝试使用它们时,它们抛出异常并且不会显示文件。我很想知道这是因为我配置错误的 Aptana 还是编辑器中的实际错误。
I'd also be veryinterested in any way of compiling Sass that integrated with Ecplise so that I didn't have to run something separate from it. (or a way of putting Sass/Compass in the Ecplise build process.)
我也对编译与 Ecplise 集成的 Sass 的任何方式都非常感兴趣,这样我就不必运行与它分开的东西。(或将 Sass/Compass 放入 Ecplise 构建过程的一种方式。)
采纳答案by Pascal Thivent
Well, what about Aptana? According to the Haml/Saas Syntax Highlighting in Aptana/Eclipseblog post:
那么,Aptana怎么样?根据Aptana/Eclipse博客文章中的Haml/Saas 语法突出显示:
Recently, I have been using Hamlin some my Rails projects. It simply makes your views clean and readable. One issue I had was syntax highlighting in my favorite IDE, Aptana Studio. The Haml syntax highlighting supporthas been stopped a while ago and more issues have raised after Aptana recent updates.
After some research, I found a solution posted by Max Kostovetski, a member of Haml Google group. Now, to the steps:
- Download the following files to your hard drive:>
- From
AptanaEclipse "Window" menu, select "Preferences..."- In the the preferences window, select "Editors" > "Generic Text"
- Press "Add..." to add new file extensions:
*.haml
and*.sass
- For each of the new extensions, click it and press "Browse..." to select the proper lexer file (
*.lxr
)- For colorization, press "Import..." to import the
*.col
files- Press "OK"
- Enjoy you Haml views
最近,我一直在我的一些 Rails 项目中使用Haml。它只是使您的视图清晰易读。我遇到的一个问题是我最喜欢的 IDE Aptana Studio 中的语法突出显示 。Haml语法高亮支持已在不久前停止,并且在 Aptana 最近更新后引发了更多问题。
经过一番研究,我找到了 Haml Google 小组成员 Max Kostovetski 发布的解决方案。现在,到步骤:
- 将以下文件下载到您的硬盘:>
- 从
AptanaEclipse“窗口”菜单中,选择“首选项...”- 在首选项窗口中,选择“编辑器”>“通用文本”
- 按“添加...”添加新的文件扩展名:
*.haml
和*.sass
- 对于每个新扩展,单击它并按“浏览...”以选择正确的词法分析器文件 (
*.lxr
)- 对于着色,按“导入...”导入
*.col
文件- 按“确定”
- 享受哈姆勒美景
PS: Refer to the original blog post as it provides up-to-date links.
PS:请参阅原始博客文章,因为它提供了最新链接。
Note:this can be used with the Aptana RadRails Eclipse pluginas well as Aptana Studio
注意:这可以与Aptana RadRails Eclipse 插件以及 Aptana Studio 一起使用
UPDATE:At the time of writing, RadRails and Studio seems to support Haml and Sass so it might now be unnecessary to follow the steps above.
更新:在撰写本文时,RadRails 和 Studio 似乎支持 Haml 和 Sass,因此现在可能没有必要遵循上述步骤。
To compile SaaS in an "integrated" way inside Eclipse, you could maybe just use an External Tool(Run > External Tools). Another more elaborated option would be to add a "Program Builder" to your project's Builderslike in this blog post. Of course, the described solution would require to be adapted to Saas but the principles behind it seems to apply. Caution: I didn't implement it myself, it's just an idea and I'm not even sure it makes sense.
要在 Eclipse 中以“集成”方式编译 SaaS,您可能只使用外部工具(运行 > 外部工具)。另一个更详细的选择是向您的项目的构建器添加一个“程序构建器”,就像这篇博文中一样。当然,所描述的解决方案需要适应 Saas,但其背后的原则似乎适用。注意:我没有自己实现它,这只是一个想法,我什至不确定它是否有意义。
回答by Igor
Notice that latest EclipseColoreractually supports both HAML&SASS. It may be a good alternative choice if you don't need a full featured Aptana IDE, but just looking for an editor.
请注意,最新的EclipseColorer实际上同时支持 HAML 和 SASS。如果您不需要全功能的 Aptana IDE,而只是寻找一个编辑器,它可能是一个不错的替代选择。
EclipseColorer also gives you better syntax mixin support: other languages inside of HAML are highlighted with respect of their syntax (mixins for ruby, javascript, css, even sass).
EclipseColorer 还为您提供了更好的语法混合支持:HAML 中的其他语言根据其语法(ruby、javascript、css 甚至 sass 的混合)突出显示。
回答by Rob R
I know this is an old question, but for anyone new to SASS aond Compass like me, I just installed Aptana Studio 3 and it now has support for .scss, .sass, and .haml. Enjoy.
我知道这是一个老问题,但对于像我这样的 SASS 和 Compass 新手,我刚刚安装了 Aptana Studio 3,它现在支持 .scss、.sass 和 .haml。享受。
回答by Nelson Teixeira
I found Colorer plugin in Igor's answer interesting, yet I use .scss file extention and it only works for .sass files. Here's how to make it support .scss file extension:
我发现 Igor 的回答中的 Colorer 插件很有趣,但我使用 .scss 文件扩展名,它仅适用于 .sass 文件。以下是使其支持 .scss 文件扩展名的方法:
First install the plugin as normal. Select Install New software
in Help menu in Eclipse and add the following repository: http://colorer.sf.net/eclipsecolorer
. Now select this repository and you should see the Eclipse Colorer install option. There is no drag-install option AFAIK.
首先正常安装插件。Install New software
在 Eclipse 的帮助菜单中选择并添加以下存储库:http://colorer.sf.net/eclipsecolorer
. 现在选择这个存储库,您应该会看到 Eclipse Colorer 安装选项。AFAIK 没有拖动安装选项。
After install, goto Colorer plugin folder inside Eclipse's plugin directory. In my case that's eclipse/plugins/net.sf.colorer_0.9.9/
. There you'll have to modify 3 files:
安装后,转到 Eclipse 插件目录中的 Colorer 插件文件夹。就我而言,那是eclipse/plugins/net.sf.colorer_0.9.9/
. 在那里你必须修改 3 个文件:
- colorer/hrc/common.jar
- colorer/hrc/proto.hrc
- /plugin.xml
- 着色器/hrc/common.jar
- 着色器/hrc/proto.hrc
- /插件.xml
Before doing any of the below instruction, please backup all files in the folder in order to restore them if anything goes wrong.
在执行以下任何说明之前,请备份文件夹中的所有文件,以便在出现任何问题时恢复它们。
Modifying common.jar
修改common.jar
Extract common.jar to an empty folder. This is done as any normal tar.gz file. Once extracted you'll have to modify 2 files in it:
将 common.jar 解压缩到一个空文件夹。这是作为任何普通的 tar.gz 文件完成的。解压后,您必须修改其中的 2 个文件:
duplicate lines 53 and 53 in inet/haml.hrc
and change it to scss. The result should be like below:
复制第 53 行和第 53 行inet/haml.hrc
并将其更改为 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'/>
now copy inet/sass.hrc
to inet/scss.hrc
and change the relevant lines. The resulting scss.hrc
should be like below:
现在复制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 ***** -->
after this, run the following command in the folder where you extract common.jar to recreate the jar file:
之后,在解压 common.jar 的文件夹中运行以下命令以重新创建 jar 文件:
jar cf common.jar *
then substitute the original jar file by this one.
然后用这个替换原来的jar文件。
Other files
其它文件
Now, include scss extension in /plugin.xml
line 37:
现在,在/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"
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"
And finally, duplicate lines 200-203 in colorer/hrc/proto.hrc
. The result should be like below:
最后,在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>
After this restart eclipse and you should have syntax highlighting for .scss files.
重新启动 eclipse 后,您应该对 .scss 文件进行语法高亮显示。
回答by Ned Martin
Aptana causes too many problems for me, so after lots of searching (which turned up this thread), I found LiClipseText (https://marketplace.eclipse.org/content/liclipsetext)
Aptana 给我带来了太多问题,所以经过大量搜索(找到了这个线程),我找到了 LiClipseText ( https://marketplace.eclipse.org/content/liclipsetext)
It is a plugin that provides, amongst other things, syntax highlighting for SASS/SCSS files. It seems to work, and has "Syntax Highlighting (LiClipse, TextMate or SublimeText based)" so is probably quite configurable (I have not played around with it much, but the basic syntax highlighting feature is working for me, which is more than the Eclipse WST CSS editor could do for SCSS files).
它是一个插件,除其他外,还为 SASS/SCSS 文件提供语法高亮显示。它似乎可以工作,并且具有“语法突出显示(基于 LiClipse、TextMate 或 SublimeText)”,因此可能是非常可配置的(我没有过多使用它,但是基本的语法突出显示功能对我有用,这不仅仅是Eclipse WST CSS 编辑器可以处理 SCSS 文件)。
It is the open-sourced editor component of the commercial LiClipse plugin (https://marketplace.eclipse.org/content/liclipse) which I have not used.
它是我没有使用过的商业 LiClipse 插件 ( https://marketplace.eclipse.org/content/liclipse)的开源编辑器组件。
回答by JasCav
While it doesn't appear that there are any HAML or SASS syntax highlighters yet, you may want to consider doing something along the lines of bringing VIM (which does have support for HAML syntax highlighting) into Eclipse via a few available plugins. Eclimmight be a possibility (although, I have not used it - just trying to offer other alternatives).
虽然似乎还没有任何 HAML 或 SASS 语法高亮器,但您可能需要考虑通过一些可用的插件将 VIM(它确实支持 HAML 语法高亮显示)引入 Eclipse。 Eclim可能是一种可能性(尽管我没有使用它 - 只是试图提供其他替代方案)。
Another options is to take an already existing Eclipse syntax highlighting plug-in and add syntax highlighting for Sass and/or HAML. Something like the Eclipse Colorermay be worth looking into.
另一种选择是采用现有的 Eclipse 语法突出显示插件,并为 Sass 和/或 HAML 添加语法突出显示。Eclipse Colorer 之类的东西可能值得研究。