การ build อัตโนมัติใน Webpack

เราสามารถตั้งค่าให้ Webpack ติดตามการเปลี่ยนแปลง ไฟล์ในโปรเจกต์และรันกระบวนการ build ขึ้นมาใหม่ทุกครั้งได้ โดยอัตโนมัติ ในการทำเช่นนั้น ภายใน scripts จำเป็นต้องเพิ่มการตั้งค่าดังต่อไปนี้:

"watch": "webpack --mode development --watch"

ผลลัพธ์ที่ได้ ไฟล์ package.json ของเรา จะมีลักษณะดังนี้:

"scripts": {
	"build": "webpack",
	"dev":   "webpack --mode development",
	"prod":  "webpack --mode production",
	"watch": "webpack --mode development --watch"
},

สามารถเริ่มการติดตามไฟล์ได้ด้วย คำสั่งต่อไปนี้:

npm run watch

หลังจากนั้น จะไม่สามารถพิมพ์คำสั่งใดๆ ลงใน เทอร์มินัลได้ จนกว่าคุณจะหยุดการติดตาม ด้วยคำสั่ง Ctrl + C

เพิ่มการตั้งค่าที่สอดคล้องกันลงใน ไฟล์ package.json ของคุณ

เริ่มการทำงานของ Webpack ในโหมดติดตามไฟล์

ทำการเปลี่ยนแปลงไฟล์ในโปรเจกต์ ตรวจสอบว่าเกิดกระบวนการ build อัตโนมัติขึ้น

หยุดการติดตามด้วยคำสั่งที่เกี่ยวข้อง