LESS - Eklentiler

Bu bölümde, sitenin işlevselliğini genişletmek için bir Eklentinin nasıl yüklenebileceğini anlayacağız. İşinizi kolaylaştırmak için eklentiler kullanılabilir.

Komut satırı

Eklentiyi komut satırını kullanarak kurmak için önce lessc eklentisini kurmanız gerekir. Eklenti , başlangıçta daha az eklenti kullanılarak yüklenebilir . Aşağıdaki komut satırı clean-css eklentisini kurmanıza yardımcı olacaktır -

npm install less-plugin-clean-css

Doğrudan, aşağıdaki komutu kullanarak yüklenen eklentiyi kullanabilirsiniz -

lessc --plugin = path_to_plugin = options

Kodda Eklenti Kullanma

Node'da eklenti gereklidir ve bir diziye bir seçenek eklentisi olarak daha azına aktarılır.

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

Tarayıcıda

Less.js komut dosyasından önce, eklenti yazarı javascript dosyasını sayfaya eklemelidir.

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

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

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

Daha Az Eklenti Listesi

Aşağıdaki tablo LESS'te bulunan eklentileri listelemektedir.

Son İşlemci / Özellik Eklentileri

Sr.No.	Eklentiler ve Açıklama
1	Otomatik düzeltici LESS'ten çevrildikten sonra CSS'ye önekler eklemek için kullanılır.
2	CSScomb Stil sayfanızın bakımını iyileştirmeye yardımcı olur.
3	temiz css LESS'ten gelen CSS çıktısını küçültür.
4	CSSWring LESS'ten gelen CSS çıktısını sıkıştırır veya küçültür.
5	css çevirme CSS'yi soldan sağa (LTR) veya sağdan sola (RTL) oluşturmak için kullanılır.
6	fonksiyonlar LESS'in işlevini LESS'in kendisine yazar.
7	küre Birden fazla dosyayı içe aktarmak için kullanılır.
8	group-css-media-sorgular Daha az için sonradan işleme yapar.
9	satır içi url'ler URL'yi otomatik olarak data uri'ye dönüştürür.
10	npm-içe aktarma Npm paketinden daha ucuza ithalat yapar.
11	memnun etmek Daha az son işlem için kullanılır.
12	rtl LESS, ltr'den (soldan sağa) rtl'ye (sağdan sola) ters çevrilir.

Çerçeve / Kitaplık İçe Aktarıcıları

Sr.No.	İthalatçılar ve Açıklama
1	Önyükleme Bootstrap LESS kodu, özel LESS kodundan önce içe aktarılır.
2	Bower Çöz LESS dosyalar Bower paketlerinden içe aktarılır.
3	Less.js için Kardinal CSS Özel LESS kodundan önce, Cardinal için LESS kodu içe aktarılır.
4	Flexbox Izgarası En yaygın olarak içe aktarılan Çerçeve veya kitaplık içe aktarıcı.
5	Esnek Izgara Sistemi Esnek Izgara Sistemini içe aktarır.
6	İyonik İyonik çerçeveyi içe aktarır.
7	Lesshat Lesshat karışımlarını içe aktarır.
8	İskelet İskeleti daha az kod alır.

İşlev Kitaplıkları

Sr.No.	İthalatçılar ve Açıklama
1	gelişmiş renk işlevleri Daha zıt renkler bulmak için kullanılır.
2	cubehelix 1'in gama düzeltme değerini kullanarak, küp sarmal işlevi iki renk arasında bir renk döndürebilir.
3	listeler Bu, işleme işlevleri kitaplığını listeler.

Eklenti Yazarları için

DAHA AZ, bir yazarın daha azıyla birleşmesine izin verir.

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

pluginManager dosya yöneticileri, post işlemcileri veya ziyaretçiler ekleyebilen bir tutucu sağlar.
setOptions işlev dizeyi geçer.
printUsage seçenekleri açıklamak için kullanılır.