Devtool ใน Webpack คืออะไร?
Devtool ใน Webpack คืออะไร?

วีดีโอ: Devtool ใน Webpack คืออะไร?

วีดีโอ: Devtool ใน Webpack คืออะไร?
วีดีโอ: Webpack 5: Generate Source Maps using Webpack 2024, เมษายน
Anonim

Devtool . ตัวเลือกนี้ควบคุมว่าแมปต้นทางจะถูกสร้างขึ้นหรือไม่และอย่างไร ใช้ SourceMapDevToolPlugin สำหรับการกำหนดค่าที่ละเอียดยิ่งขึ้น ดู source-map-loader เพื่อจัดการกับ source map ที่มีอยู่

Sourcemap ใน Webpack คืออะไร?

ในแง่หนึ่ง แผนที่ต้นทางเป็นตัวถอดรหัสสำหรับรหัสลับ (ย่อเล็กสุด) ของคุณ โดยใช้ เว็บแพ็ค ระบุ devtool: "source-map" ใน your เว็บแพ็ค config จะเปิดใช้งานซอร์สแมปและ เว็บแพ็ค จะส่งออกคำสั่ง sourceMappingURL ในไฟล์ย่อสุดท้ายของคุณ

ต่อมาคำถามคือ Webpack merge คืออะไร? เว็บแพ็ค - ผสาน ให้ ผสาน ฟังก์ชันที่เชื่อมอาร์เรย์และรวมออบเจ็กต์เข้าด้วยกันเพื่อสร้างออบเจกต์ใหม่ เมื่อใดก็ตามที่คุณต้องการ ผสาน วัตถุการกำหนดค่า เว็บแพ็ค - ผสาน สามารถมาสะดวก นอกจากนี้ยังมี เว็บแพ็ค เฉพาะเจาะจง ผสาน ตัวแปรที่เรียกว่า ผสาน.

เกี่ยวกับเรื่องนี้ Webpack ใช้ทำอะไร?

เว็บแพ็ค เป็นชุดรวมโมดูลสแตติกสำหรับแอปพลิเคชัน JavaScript - ใช้โค้ดทั้งหมดจากแอปพลิเคชันของคุณและทำให้สามารถใช้งานได้ในเว็บเบราว์เซอร์ โมดูลเป็นส่วนของโค้ดที่ใช้ซ้ำได้ ซึ่งสร้างจาก JavaScript, node_modules, รูปภาพ และสไตล์ CSS ของแอปซึ่งจัดเป็นแพ็กเกจเพื่อให้ง่ายต่อการใช้งาน ใช้ใน เว็บไซต์ของคุณ.

Sourcemaps ทำงานอย่างไร

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

แนะนำ: