使用LESS的工具体验
作为对大卫·赫尔利的“少做”总结的后续文章,即在Joomla中少做,我整理了一份工具和程序的列表,您可以使用这些工具和程序使使用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功能、混入等。
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(PHPStorm)来说,已经提供了LESS高亮显示、编译器和其他各种功能。但是,编辑器是收费的。
在开源方面,也有一些其他流行的替代方案,它们具有相同的高亮显示和编译功能。
NetBeans是一个非常流行的编辑器,您可以为编辑器安装LESS插件。
Eclipse是另一个非常流行的代码编辑器,它也提供了LESS高亮显示模块和编译器。
所以无论您使用哪种代码编辑器,都有适合您使用的工具和代码。
仍在学习LESS?
没问题,这也是一个好的选择。随着许多模板开发者朝着相同的方向前进,学习LESS来加速您的开发和实施过程对于现代网站建设至关重要。
开始学习基本概念和思想的最佳地点是:https://lesscss.org.cn/
发表在Joomla社区杂志上的某些文章代表了作者对特定主题的个人意见或经验,可能并不代表Joomla项目的官方立场。
通过接受,您将访问 https://magazine.joomla.net.cn/ 之外的第三方外部服务
评论