Mais conteúdo relacionado Webpack Module Bundler | cloudcourse.io7. เร็ว !!
Webpack ใช async I/O รวมกับการทํา cache หลายชั้น
ทําใหขั้นตอนในการ compile นั้นมีความเร็วสูงมาก
CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
10. LOADER
การเขียน ES6, JSX, TypeScript หรือ JavaScript Modules ตางๆ
สุดทายแลว เราก็ตองแปลงโคดเหลานี้ใหกลับมาเปน JavaScript
CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
15. DEV SERVER
ซึ่งความสามารถของ Web Server ตัวนี้ก็ไมใชเลนๆ มันสามารถทําการ
รีเฟรชหนาจอเองไดเมื่อมีการแกไขขอมูลเหมือนกับ BrowserSync
CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
17. DEV SERVER
หรือสําหรับใครที่เขียน ReactJS ก็มีความสามารถเด็ดๆเชนมันจะเรนเดอร
เฉพาะ component ที่มีการแกไขเทานั้นและมันยังสามารถรักษา state เดิม
ที่มันเปนอยูไวไดอีกดวย
CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
18. CODE SPLITTER
บางครั้งการรวม Modules หลายๆตัวเขาดวยกันมันอาจ
ทําใหไฟลที่ถูก Compile ออกมานั้นมีขนาดใหญมาก
ซึ่งอาจจะไมเปนผลดีตอเซิรฟเวอรของเรา
CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
20. CODE SPLITTER
เชน ในสวนหลักเปน Core จําเปนตองใชงานทุกที่ก็สามารถแยกไวเปน
ไฟลหลักได และไฟลยอยอื่นๆที่อาจจะไมไดใชทุกที่ก็สามารถแยกออกมา
เปนไฟลยอยๆได ลักษณะการทํางานอาจจะคลายกับ RequireJS
CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
47. CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
เพิ่ม --watch หลัง webpack เพื่อทําการตรวจจับไฟลวามีการเปลี่ยนแปลงหรือไม
ถามีการเปลี่ยนแปลงก็จะทําการ compile ใหทันที
67. CLOUDCOURSE.IO | THAPWARIS CHINSIRIRATHKUL
ทดสอบการทํางานโดยการเปลี่ยน value ของ css จากนั้น webpack จะทําการแสดงผลดวยการ inject css ทันที