3 วิธีในการแก้ไขข้อผิดพลาด Can't แก้ไขข้อผิดพลาด react-router-dom

ถ้าคุณเป็น React โปรแกรมเมอร์ ใครเป็นคนสร้างเว็บ แอปพลิเคชั่นคุณจะต้องใช้เราเตอร์เฉพาะเพื่อช่วยให้ผู้ใช้นำทางผ่าน

แต่บางครั้งอาจเกิดปัญหาและแสดงข้อความ ไม่พบโมดูล: ไม่สามารถแก้ไข react-router-dom และคุณอาจไม่รู้ว่าจะแก้ไขอย่างไร

วันนี้เราจะช่วยคุณแก้ไขข้อผิดพลาดที่พบบ่อยที่สุดของเราเตอร์ React อ่านต่อเพื่อหาคำตอบ!

React Router Dom คืออะไร?

React Router เป็นไลบรารีการกำหนดเส้นทางฝั่งไคลเอ็นต์ไปยังฝั่งเซิร์ฟเวอร์สำหรับ React React Router Dom ใช้การกำหนดเส้นทางแบบไดนามิกในเว็บแอปที่ช่วยให้ผู้ใช้นำทางได้อย่างมีประสิทธิภาพ

นักพัฒนาที่สร้างเว็บแอป React ใช้ React Router Dom เพื่อสร้าง แอปพลิเคชั่นหน้าเดียว บนเว็บ กล่าวคือ เว็บแอปพลิเคชันที่มีหลายหน้าหรือส่วนประกอบจำนวนมากจะไม่ได้รับการรีเฟรช ค่อนข้างจะดึงเนื้อหาแบบไดนามิก

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

ตอนนี้คุณรู้แล้วว่าการเราต์คืออะไรและทำไมโปรแกรมเมอร์ถึงใช้ React Router Dom ยังมีสิ่งหนึ่งที่คุณควรรู้ React Router มีสามประเภทและแต่ละประเภทมีจุดประสงค์

ความแตกต่างระหว่าง React Router VS React Dom VS React Native

หากคุณเป็นนักพัฒนา React คุณมีไลบรารีสามแบบให้เลือก ทั้งสามเกือบจะเหมือนกัน แต่มีกรณีการใช้งาน เราจะอธิบายแต่ละข้อเพื่อให้คุณเข้าใจความแตกต่างของพวกเขา

• React-เราเตอร์ – รวมส่วนประกอบและคุณสมบัติที่กำหนดเองทั้งหมดจากไลบรารี react-router-native และ react-router-dom
• React-router-dom – ส่วนใหญ่ใช้สำหรับเว็บแอปพลิเคชันที่สร้างด้วย React
• React-router-native – สร้างขึ้นสำหรับ React Native framework ที่ใช้สร้างแอปพลิเคชั่นมือถือโดยใช้ React

ฉันควรทำอย่างไรหากเห็นข้อความไม่พบโมดูลข้อผิดพลาด

1. ติดตั้งการพึ่งพาอย่างถูกต้อง

1. ติดตั้งการพึ่งพาอย่างถูกต้อง
2. ตรวจสอบว่าคุณพิมพ์ถูกต้องหรือไม่ react-router-dom หรือถ้าคุณพิมพ์ react-dom หรือ ตอบสนอง dom? เพราะสองอันหลังผิด
3. หากไม่ได้ติดตั้งการพึ่งพาอย่างถูกต้อง ให้ใช้คำสั่ง react-router-dom เพื่อติดตั้งการพึ่งพา
4. หากผิดพลาด ไม่พบโมดูล: ไม่สามารถแก้ไข react-router-dom ยังคงมีอยู่หลังจากติดตั้งการพึ่งพาที่ถูกต้อง จากนั้นลองใช้คำสั่งต่อไปนี้: npm ติดตั้ง react-router-dom --save หรือ npm install -S react-router-dom

ด้วยการใช้คำสั่งที่กล่าวถึงข้างต้นในคอนโซล คุณจะเพิ่มการพึ่งพาผู้พัฒนาในไฟล์ package.json ของคุณ วิธีนี้ช่วยให้คุณแก้ไขข้อผิดพลาดและติดตั้งการพึ่งพาบนคอมพิวเตอร์เครื่องอื่นที่แสดง. พร้อมกันได้ ไม่พบโมดูล: ไม่สามารถแก้ไข react-router-dom

2. อัปเดต NPM เป็นเวอร์ชัน 5

1. อัปเดต NPM เป็นเวอร์ชัน 5
2. หากต้องการอัปเดต NPM เป็นเวอร์ชัน 5 ให้ใช้คำสั่ง npm อัปเดต -g
3. ยืนยันทันทีหากคุณยังคงพบข้อผิดพลาด ไม่พบโมดูล: ไม่สามารถแก้ไข react-router-dom.

ก่อนเวอร์ชัน 5 โดยค่าเริ่มต้น NPM จะติดตั้งแพ็คเกจภายใต้ node_modules.

หากคุณกำลังพยายามติดตั้งการพึ่งพาสำหรับโมดูล/แอป คุณจะต้องติดตั้งแล้วเพิ่มลงในส่วนการพึ่งพาใน package.json ด้วยตนเอง เมื่ออัปเดตเป็นเวอร์ชัน 5 คุณจะแก้ไขปัญหาต่างๆ ได้ เช่น แก้ Axios ไม่ได้

3. ตรวจสอบว่าคุณได้ติดตั้งการพึ่งพาที่ถูกต้องหรือไม่

1. ตรวจสอบว่าคุณได้ติดตั้งการขึ้นต่อกันที่ถูกต้องในโค้ด VS หรือไม่ กดปุ่ม Ctrl ค้างไว้แล้วคลิกซ้ายที่ปุ่ม react-router-dom คำ.
2. หลังจากคลิก คุณควรถูกเปลี่ยนเส้นทางไปยังไฟล์ต้นทาง node_modules ของการพึ่งพา หากคุณไม่ได้รับการเปลี่ยนเส้นทาง ให้ติดตั้งอีกครั้ง
3. คุณสามารถติดตั้งโดยใช้คำสั่ง npm ติดตั้ง react-router-dom --save หรือ npm install -S react-router-dom

ดิ แก้ไม่ได้ ใน React Router มักเกิดจากการติดตั้งที่ไม่เหมาะสม และนี่เป็นเรื่องปกติเมื่อคุณไม่ได้ติดตั้งการพึ่งพาที่ถูกต้องในแอปพลิเคชันที่คุณพยายามใช้

React Router ช่วยสร้างเว็บแอปโดยรักษา UI และ URL ของแอปพลิเคชันของคุณให้ตรงกัน แอปพลิเคชันเหล่านี้ง่ายต่อการปรับใช้ ทำงานอย่างมีประสิทธิภาพ และปรับปรุงประสบการณ์ผู้ใช้อย่างมาก

แต่เช่นเดียวกับส่วนใหญ่ React Router ในบางครั้งอาจหยุดทำงานหรือแสดงรหัสข้อผิดพลาด และคุณสามารถแก้ไขได้ด้วยความช่วยเหลือที่เหมาะสม

เราหวังว่าเราจะช่วยคุณแก้ไขข้อผิดพลาดนี้ และยินดีรับฟังความคิดเห็นจากคุณเกี่ยวกับปัญหาดังกล่าวในความคิดเห็นด้านล่าง