Less安装步骤

要想安装Less,您的电脑上必须要先配置好Ruby环境,还要安装Ruby的一个组件——RubyGems。因为在中国,Windows系统的安装率是最高的,那这里就介绍下在Windows系统下Less的安装步骤,在Linux下的安装步骤也大同小异。

首先下载Ruby的安装文件,可以到这里下载,建议选择“一步安装”程序。安装过程非常简单,和普通安装程序过程无异,但可以留心下安装组件步骤:

Ruby 安装组件

可以把里面SciteEnable RubyGems两个选项去掉。Scite是一个文本编辑器,我一直用这个编辑器,功能很强大(嘿嘿,忍不住又夸奖几句),但Ruby的这个版本是面向于Ruby配置的,而我有很多种文件类型要编辑,所以我选用Scite官方发布的版本。

Ruby自带的RubyGems的版本太低,还要从RubyGems官方网站上下载,最好下载最新的版本。把下载下的压缩包解压,如我把它解压到了E:\rubygems目录下,然后打开命令窗口,输入如下命令:

E:
cd rubygems
ruby setup.rb

如图所示:

rubygems 安装

安装成功后会的界面:

rubygems 安装成功

安装好了RubyRubyGems可以安装Less了,到这里下载安装文件,然后解压。我把它解压到了E:\less目录下。打开命令行窗口,输入如下命令:

E:
cd less\lib
gem install less

如图所示:

Less 安装

安装成功后会的界面:

Less 安装成功

下面开始编写Less文件了。例如我在E:\lessExample目录下新建一个文件,文件全称为example.less,输入如下代码:

/* LESS */

@brand_color: #4D926F;

#header {
  color: @brand_color;
}

h2 {
  color: @brand_color;
}

打开命令行窗口,输入如下命令:

E:
cd lessExample
lessc example.less

运行完后如果你在E:\lessExample目录下发现产生了一个新文件:example.css,打开后其代码应该如下:

#header { color: #4D926F; }
h2 { color: #4D926F; }

这样就表明Less已经安装好了,你接下来的任务就是感受它的强大与灵活。

此条目发表在 前端 分类目录,贴了 , 标签。将固定链接加入收藏夹。