LESS - 插件

在本章中，我们将了解如何上传插件来扩展网站的功能。插件可以让您的工作更轻松。

命令行

要使用命令行安装插件，首先需要安装 lessc 插件。可以在开始时使用less-plugin安装插件。以下命令行将帮助您安装 clean-css 插件 -

npm install less-plugin-clean-css

您可以直接使用以下命令来使用已安装的插件 -

lessc --plugin = path_to_plugin = options

在代码中使用插件

在 Node 中，该插件是必需的，并且它作为选项插件传递到一个数组中。

var pluginName = require("pluginName");
less.render(myCSS, { plugins: [pluginName] })
   .then(function(output) {
   },
   function(error) {
   });

在浏览器中

在 less.js 脚本之前，插件作者应该在页面中包含 javascript 文件。

<script src = "plugin.js"></script>

<script>
less = {
   plugins: [plugin]
};
</script>

<script src = "less.min.js"></script>

较少插件列表

下表列出了 LESS 中可用的插件。

后处理器/功能插件

先生。	插件及说明
1	自动前缀器它用于从 LESS 翻译后向 CSS 添加前缀。
2	CSS梳它有助于改善样式表的维护。
3	干净的CSS 它缩小了 LESS 的 CSS 输出。
4	CSS写入它压缩或缩小 LESS 的 CSS 输出。
5	CSS 翻转它用于从左到右（LTR）或从右到左（RTL）生成CSS。
6	功能它将LESS的功能写在LESS本身中。
7	全局它用于导入多个文件。
8	组 CSS 媒体查询它以更少的成本进行后处理。
9	内联网址自动将 URL 转换为数据 uri。
10	npm 导入它从 npm 包导入，成本更低。
11	请它用于对 Less 进行后处理。
12	回程 LESS 从 ltr（从左到右）反转为 rtl（从右到左）。

框架/库导入器

先生。	进口商及描述
1	引导程序 Bootstrap LESS 代码在自定义 LESS 代码之前导入。
2	鲍尔决心 LESS 文件是从 Bower 包导入的。
3	less.js 的主要 CSS 在自定义 LESS 代码之前，先导入 Cardinal 的 LESS 代码。
4	弹性盒网格最常导入的框架或库导入器。
5	灵活的网格系统它导入了灵活的网格系统。
6	离子它导入了离子框架。
7	莱沙特它导入 Lesshat mixins。
8	骨骼它导入无骨架代码。

函数库

先生。	进口商及描述
1	高级颜色功能它用于寻找更具对比的颜色。
2	立方体螺旋使用伽马校正值 1，cubehelix 函数可以返回两种颜色之间的颜色。
3	列表这列出了操作函数库。

对于插件作者

LESS 允许作者将 less 与 less 结合起来。

{
   install: function(less, pluginManager) {
   },
   
   setOptions: function(argumentString) {
   },
   
   printUsage: function() {
   },
   
   minVersion: [2, 0, 0]
}

pluginManager提供了一个可以添加文件管理器、后处理器或访问者的容器。
setOptions函数传递字符串。
printUsage函数用于解释选项。

先生。	插件及说明
1	自动前缀器它用于从 LESS 翻译后向 CSS 添加前缀。
2	CSS梳它有助于改善样式表的维护。
3	干净的CSS 它缩小了 LESS 的 CSS 输出。
4	CSS写入它压缩或缩小 LESS 的 CSS 输出。
5	CSS 翻转它用于从左到右（LTR）或从右到左（RTL）生成CSS。
6	功能它将LESS的功能写在LESS本身中。
7	全局它用于导入多个文件。
8	组 CSS 媒体查询它以更少的成本进行后处理。
9	内联网址自动将 URL 转换为数据 uri。
10	npm 导入它从 npm 包导入，成本更低。
11	请它用于对 Less 进行后处理。
12	回程 LESS 从 ltr（从左到右）反转为 rtl（从右到左）。

先生。	进口商及描述
1	高级颜色功能它用于寻找更具对比的颜色。
2	立方体螺旋使用伽马校正值 1，cubehelix 函数可以返回两种颜色之间的颜色。
3	列表这列出了操作函数库。