แนะนำ Gulp 4

Gulp เป็นเครื่องมือสำหรับทำให้งานที่เกิดขึ้นบ่อยๆ ในการพัฒนาเว็บไซต์เป็นไปโดยอัตโนมัติ: เช่น การย่อขนาดไฟล์ CSS และ JavaScript, การรวมไฟล์หลายไฟล์เป็นไฟล์เดียว, การแปลง LESS และ SASS เป็น CSS, การแปลงภาษา TypeScript เป็น JavaScript และงานในลักษณะนี้

หลักการทำงานของมันมีดังนี้: สำหรับระบบ Gulp จะมีการเขียนงาน (task) ขึ้นมา จากนั้น Gulp จะทำงานเหล่านั้นตามลำดับที่กำหนด

มาเริ่มติดตั้ง Gulp กัน สำหรับสิ่งนี้ในบรรทัดคำสั่งจำเป็นต้องรันคำสั่ง:

terminalnpm install --global gulp-cli

ตอนนี้เรามาสร้างโปรเจกต์ที่จะใช้งาน Gulp กัน สำหรับสิ่งนี้ในโฟลเดอร์โปรเจกต์ให้สร้างโครงสร้างไฟล์ดังต่อไปนี้:

• /src//js/script1.jsscript2.jsscript3.js/css/styles1.cssstyles2.css/img/image1.pngimage2.pngimage3.pngindex.html

นอกจากนี้ในโฟลเดอร์โปรเจกต์จำเป็นต้องเพิ่มไฟล์ package.json, หลังจากนั้นจึงสามารถติดตั้ง Gulp ในโปรเจกต์ได้ สำหรับสิ่งนี้ในบรรทัดคำสั่ง โดยอยู่ใน โฟลเดอร์โปรเจกต์ จำเป็นต้องรันคำสั่งต่อไปนี้:

terminalnpm install --save-dev gulp