Less 插件

2023-05-04 13:48 更新

插件可以上傳來(lái)擴(kuò)展網(wǎng)站的功能。 插件用于使您的工作更輕松。


命令行

要使用命令行安裝插件,首先需要安裝lessc插件。 該插件可以使用 less-plugin 開(kāi)頭安裝。 下面是安裝clean-css插件的命令行:

npm install less-plugin-clean-css


如果提及了無(wú)法識(shí)別的選項(xiàng),那么它會(huì)嘗試加載該選項(xiàng)并顯示一條消息,說(shuō)明沒(méi)有輸入文件。例如:

lessc --clean-css="advanced"


直接,您可以使用以下命令使用安裝的插件:

lessc --plugin=path_to_plugin=options


在代碼中使用插件

在Node中,插件是必需的,它作為一個(gè)選項(xiàng)插件傳遞給一個(gè)數(shù)組。

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


在瀏覽器中

在less.js腳本之前,插件作者應(yīng)該在頁(yè)面中包含javascript文件。

<script src="plugin.js"></script>
<script>
less = {
    plugins: [plugin]
};
</script>
<script src="less.min.js"></script>


較少插件列表

以下是LESS中可用的插件列表。


后處理器/功能插件

S.N. 插件及描述
1 Autoprefixer

它用于在從LESS轉(zhuǎn)換后向CSS添加前綴。
2 CSScomb

它有助于改進(jìn)樣式表的維護(hù)。
3 clean-css

它縮小LESS的CSS輸出。
4 CSSWring

它壓縮或縮小LESS的CSS輸出。
5 css-flip

它用于從左到右(LTR)或從右到左(RTL)生成CSS。
6 functions

在LESS本身中寫(xiě)入LESS的函數(shù)。
7 glob

使用glob表達(dá)式,可以導(dǎo)入多個(gè)文件。
8 group-css-media-queries 

它有能力做更少的后處理。
9 inline-urls

自動(dòng)將網(wǎng)址轉(zhuǎn)換為數(shù)據(jù)uri。
10 npm-import

它有能力從npm包導(dǎo)入較少。
11 pleeease

它用于后處理Less。
12 rtl

LESS從ltr(從左到右)反轉(zhuǎn)到rtl(從右到左)。


框架/庫(kù) Importers

S.N. Importers 及描述
1 Bootstrap

Bootstrap LESS代碼在自定義LESS代碼之前導(dǎo)入。
2 Bower Resolve

LESS文件是從Bower軟件包導(dǎo)入的。
3 Cardinal CSS for less.js

在定制LESS代碼之前,導(dǎo)入Cardinal的LESS代碼。
4 Flexbox Grid

flexboxgrid導(dǎo)入。
5 Flexible Grid System

它進(jìn)口柔性網(wǎng)格系統(tǒng)。
6 Ionic

它進(jìn)口離子骨架。
7 Lesshat

它進(jìn)口Lesshat mixins。
8 Skeleton

它導(dǎo)入少骨骼代碼。


函數(shù)庫(kù)

S.N. Importers 及描述
1 advanced-color-functions


它用于找到更多的對(duì)比色。

2 cubehelix

使用伽馬校正值1,立方體角色函數(shù)可以返回兩種顏色之間的顏色。
3 lists

列出操作函數(shù)庫(kù)。


插件作者

LESS允許作者結(jié)合較少。

{
    install: function(less, pluginManager) {
    },
    setOptions: function(argumentString) {
    },
    printUsage: function() {
    },
    minVersion: [2, 0, 0]
}
  • pluginManager提供了一個(gè)持有者,可以添加文件管理器,后處理器或訪(fǎng)問(wèn)者。

  • setOptions函數(shù)傳遞字符串。

  • printUsage函數(shù)用于解釋選項(xiàng)。


以上內(nèi)容是否對(duì)您有幫助:
在線(xiàn)筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)