Less安装、使用及插件推荐

less安装

1. 安装node.js，版本8.0以上，网址：http://nodejs.cn/download/
2. 检查是否安装成功，使用cmd命令（win10 是window+r 打开运行 或在搜索框中 输入cmd） — 输入“node -v”查看版本即可。
3. 基于nodejs在线安装less，使用cmd命令“npm install -g less”即可
4. 检查是否安装成功，使用cmd命令 “lessc -v”查看版本即可

less使用

我们首先新建一个后缀名为less的文件，在这个less文件里面书写less语句

在my.less中定义自己的样式规则

// 定义背景颜色
@bgColor: #ccc;

// 定义字体颜色
@fontColor: #fff;

// 定义字体大小
@fontSize: 20px;

body {
    background-color: @bgColor;
    font-size: @fontSize;
    color: @fontColor;
    text-align: center;
}

less编译

本质上，less包含一套自定义的语法及一个解析器，用户根据这些语法定义自己的样式规则，这些规则最终会通过解析器，编译生成对应的CSS文件。
所以，我们需要把我们的less文件，编译生成css文件，这样我们的html页面才能使用。

插件推荐

每次保存less文件后，Easy LESS插件都会自动编译less文件，然后生成css文件。此外，你也可以手动触发编译：通过Ctrl+Shift+P快捷键打开命令面板，然后输入并执行Compile LESS to CSS命令。

编译好后，生成的对应的css文件