น้อย - ปลั๊กอิน

ในบทนี้เราจะทำความเข้าใจว่าปลั๊กอินสามารถอัปโหลดเพื่อขยายการทำงานของไซต์ได้อย่างไร ปลั๊กอินสามารถใช้เพื่อทำให้งานของคุณง่ายขึ้น

บรรทัดคำสั่ง

ในการติดตั้งปลั๊กอินโดยใช้บรรทัดคำสั่งก่อนอื่นคุณต้องติดตั้งปลั๊กอิน lessc สามารถติดตั้งปลั๊กอินได้โดยใช้ปลั๊กอินน้อยในตอนเริ่มต้น บรรทัดคำสั่งต่อไปนี้จะช่วยคุณติดตั้งปลั๊กอิน clean-css -

npm install less-plugin-clean-css

โดยตรงคุณสามารถใช้ปลั๊กอินที่ติดตั้งโดยใช้คำสั่งต่อไปนี้ -

lessc --plugin = path_to_plugin = options

การใช้ปลั๊กอินในรหัส

ในโหนดจำเป็นต้องใช้ปลั๊กอินและส่งผ่านในอาร์เรย์เป็นปลั๊กอินตัวเลือกไปยังส่วนที่น้อยกว่า

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

Postprocessor / Feature Plugins

ซีเนียร์	ปลั๊กอินและคำอธิบาย
1	Autoprefixer ใช้เพื่อเพิ่มคำนำหน้าให้กับ CSS หลังการแปลจาก LESS
2	CSScomb ช่วยปรับปรุงการบำรุงรักษาสไตล์ชีตของคุณ
3	สะอาด css ลดขนาดเอาต์พุต CSS จาก LESS
4	CSSWring บีบอัดหรือย่อขนาดเอาต์พุต CSS จาก LESS
5	css- พลิก ใช้เพื่อสร้าง CSS จากซ้ายไปขวา (LTR) หรือขวาไปซ้าย (RTL)
6	ฟังก์ชั่น มันเขียนฟังก์ชันของ LESS ใน LESS เอง
7	ลูกโลก ใช้เพื่อนำเข้าไฟล์หลายไฟล์
8	กลุ่ม css สื่อแบบสอบถาม ดำเนินการหลังการประมวลผลสำหรับ Less
9	URL แบบอินไลน์ แปลง URL เป็น data uri โดยอัตโนมัติ
10	npm นำเข้า นำเข้าจากแพ็คเกจ npm น้อยกว่า
11	ขอร้อง ใช้เพื่อโพสต์โปรเซสน้อยลง
12	rtl LESS ถูกย้อนกลับจาก ltr (ซ้ายไปขวา) เป็น rtl (ขวาไปซ้าย)

ผู้นำเข้ากรอบ / ไลบรารี

ซีเนียร์	ผู้นำเข้าและรายละเอียด
1	Bootstrap Bootstrap โค้ด LESS จะถูกนำเข้าก่อนโค้ด LESS ที่กำหนดเอง
2	แก้ไข Bower ไฟล์ LESS ถูกนำเข้าจากแพ็คเกจ Bower
3	Cardinal CSS สำหรับ less.js ก่อนรหัส LESS ที่กำหนดเองรหัส LESS สำหรับ Cardinal จะถูกนำเข้า
4	ตาราง Flexbox ผู้นำเข้า Framework หรือไลบรารีที่นำเข้ามากที่สุด
5	ระบบกริดที่ยืดหยุ่น นำเข้าระบบ Flexible Grid
6	ไอออนิก มันนำเข้ากรอบไอออนิก
7	Lesshat นำเข้าส่วนผสมของ Lesshat
8	โครงกระดูก มันนำเข้ารหัสโครงกระดูกน้อย

ไลบรารีฟังก์ชัน

ซีเนียร์	ผู้นำเข้าและรายละเอียด
1	ฟังก์ชันสีขั้นสูง ใช้เพื่อค้นหาสีที่ตัดกันมากขึ้น
2	คิวบ์เฮลิกซ์ การใช้ค่าการแก้ไขแกมมาเท่ากับ 1 ฟังก์ชันคิวบ์เฮลิกซ์สามารถส่งคืนสีระหว่างสองสี
3	รายการ รายการนี้แสดงไลบรารีฟังก์ชันการจัดการ

สำหรับผู้เขียนปลั๊กอิน

LESS อนุญาตให้ผู้เขียนรวมกับน้อยกว่า

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

• pluginManager ให้ผู้ถือซึ่งสามารถเพิ่มตัวจัดการไฟล์โพสต์โปรเซสเซอร์หรือผู้เยี่ยมชม

• setOptions ฟังก์ชันส่งผ่านสตริง

• printUsage ฟังก์ชันใช้เพื่ออธิบายตัวเลือก