eclipse pdt中不明显的lesscss编译器

Question

我想使用像dotless这样的较少的编译器作为eclipse构建器.如果我将构建选项"运行构建器:"设置为"在自动构建期间",则构建器每运行5-10秒(这没关系),但它也要求我保存,而不是忽略未保存的文件.

作为解决方法,我激活工作区选项"在构建之前自动保存"并将Ctrl + S绑定到"构建所有"

有更好的解决方案吗？

Answer 1

为了在Eclipse中自动将LESS转换为CSS,我解释了两种可能的方法.

1. 使用插件
2. 如何手动完成

(我在编写插件后编辑了这篇文章,所以手动方式是旧的方式,原始帖子包含了一段时间,你可能已经在这里看过了一段时间)

要求

对于任何一种解决方案,您需要安装node和lessc(较少编译器).

安装lessc通过npm使用以下命令:

npm install -g less-compiler
npm install -g less

1.安装Eclipse Transpiler插件

我写了一个eclipse插件来处理eclipse中的转换.只需安装它并按照项目自述文件中的说明配置项目的转换.

- > https://github.com/gossi/eclipse-transpiler-plugin

2.手动安装构建器

我自己写了一个小脚本脚本,lessc每次保存在.less文件后运行.但是,eclipse保留了自己的环境,因此%PATHeclipse中没有可用的变量.因此,您需要lessc命令的完整路径,您可以使用which lessc以下命令找到:

$ which lessc
/usr/local/bin/lessc

另外,因为lessc在节点环境中运行:

$ head -n1 /usr/local/bin/lessc
#!/usr/bin/env node

你不能直接运行它,因为eclipse不了解你的环境.你需要预先添加node命令,才能lessc在eclipse中实现调用:

$ which node
/usr/local/bin/node

与shell脚本的完整路径,以lessc是:

#!/bin/bash

/usr/local/bin/node /usr/local/bin/lessc css/*.less > css/*.css

您可以根据项目调整输入和输出源.为了在eclipse中运行,我们需要让它作为构建器运行.干得好:

1. 右键单击您的项目> Properties> Builders.
2. 单击"新建",选择"程序"并为其指定一个很酷的名称
3. "主要"标签
   • 位置:在此处选择shell脚本
   • 工作目录:我选择了项目文件夹
4. "刷新"标签
   • [x]完成后刷新资源
   • [x]具体资源
   • 单击"指定资源..."
   • 检查编译后要刷新的资源,通常是css文件
   • 递归包含子文件夹取决于您和您的项目
5. "构建选项"
   • []分配控制台(取消选中,我们希望它保持静音,打开它进行调试)
   • [x]在后台发布
   • 运行Builder
     • []经过"干净"
     • [x]手动构建期间
     • [x]在自动构建期间
     • []在"干净"期间
   • [x]指定相关资源的工作集
   • 单击"指定资源..."
   • 选择要编译的资源,通常是.less文件.注意,不要在这里选择带有css文件的文件夹,它会在构建后刷新,无论如何,你的eclipse可能会在这里永无止境的循环中被捕获.所以.less文件就足够了.

现在,打开一个.less文件,做一些更改并保存.打开已编译的.css文件 - tada :)

视窗:

我认为这也可以在Windows上运行,使用相应的.bat文件.

玩得开心