阅读时间4分钟 (792字)

使用LESS的工具

Tools To Do LESS

作为对David Hurley关于工作更少的总结的后续文章,我指的是在Joomla中使用LESS,我列出了一些工具和程序,您可以使用它们来使使用LESS进行网站开发和编码变得容易得多,尤其是如果您来自传统的CSS基础世界,现在正在努力理解LESS是如何工作的。

本文介绍了一些在我们PB Web Development实习期间工作和学习LESS和Joomla时发现的非常有用的LESS工具。

代码高亮器

首先需要的是一个某种代码高亮器。迄今为止,在网站上编码的最受欢迎的工具无疑是Dreamweaver。虽然它是过去的遗迹,程序员的累赘,但对于新手或来自设计背景的人来说,在成熟到更强大的代码编辑器(如Eclipse、NetBeans或PHPStorm)之前,转向它是相当不错的。

Dreamweaver有一个非常好的内置CSS代码高亮器和建议CSS代码完成功能,但与LESS一起工作时,它并不能直接使用。

您需要的是Dreamweaver的一个附加扩展,允许进行额外的LESS代码高亮,这个扩展可以从Adobe扩展网站获取。
(更新2015/01/08:Dreamweaver的最新版本现在支持LESS和SASS代码高亮,您不再需要插件)。

另一个非常流行的Mac视觉代码编辑器是Coda 2,有一个美丽的LESS代码语法高亮器模块可以添加到编辑器中。

接下来,您还需要一个LESS编译器。旧浏览器可能无法识别LESS文件,并且无法渲染您的大多数LESS函数、mixin等。

LESS编译器

一旦您拥有所有LESS代码,您在将其编译成CSS之前无法对其进行测试。一些Joomla模板框架已经内置了LESS编译器,这使得动态测试变得容易一些,但在本地机器或开发环境中测试可能有点困难。

这里独立LESS编译器可以帮助处理这个过程。

CrunchApp

CrunchApp 是一个快速且易于使用的应用程序,可以编译您的LESS文件,并在您可能出错的地方显示语法行错误。尝试找到那个导致您的LESS代码出错的额外关闭括号是非常困难的。

SimpleLess

SimpleLess 工具在Windows和Mac上都能运行,允许您简单拖放编译LESS文件。它会监视文件的变化,并在需要时自动重新编译,这样您可以在编码的同时继续测试您的网站。这减少了额外的步骤,使生活更加简单。

Dreamweaver LESS编译器

Dreamweaver LESS编译器 不是最好的,也不总是能正常工作。我们个人使用它的运气也不是很好,但如果其他人有用过,我们很乐意听到您的使用经验。

WinLess

如果您是Windows开发者,那么 WinLESS 是一个自动将您的工作LESS文件目录编译为CSS的绝佳工具。它会监视并监控LESS文件的变化,并在变化发生时编译。

在线Win编译器

当您需要快速测试和验证您的LESS代码时,可以尝试使用来自WinLess的这个 在线LESS编译器。这是一个快速且易于使用的编译器,会在您编码时突出显示错误。

全功能高亮器和编译器套件

现在,如果您是一个经验丰富的编码者,并且不害怕在特定的代码应用程序中工作,那么尝试使用PHPStorm。对于 PHPStorm,有LESS高亮器、编译器等各种好东西。但是,使用编辑器需要付费。

在开源方面,还有其他也非常受欢迎且功能相似的替代方案。

NetBeans,一个非常受欢迎的编辑器,有一个 LESS插件,您可以将其安装到您的编辑器中。

Eclipse,另一个非常受欢迎的代码编辑器,还有一个 LESS高亮模块和编译器

所以无论您的代码编辑器类型如何,都有适合您使用的工具。

还在学习LESS吗?

没关系,这也是一个很好的举措。随着许多模板开发者朝着相同方向前进,学习LESS以加快您的开发和实施过程对于现代网站建设是必不可少的。

开始学习基本概念和想法的最佳地方是: https://lesscss.org.cn/

在Joomla社区杂志上发表的一些文章代表了作者对特定主题的个人观点或经验,可能并不代表Joomla项目的官方立场

0
教程:文章和模块的替代布局...
系列:开发Joomla! 3.0扩展 - 第...
 

评论

已经注册? 登录这里
还没有评论。成为第一个评论者

通过接受,您将访问由https://magazine.joomla.net.cn/之外的第三方提供的服务