วิธีเปิดใช้งานแอป Chrome DevTools สำหรับการดีบักแบบรีโมท
แอป Chrome DevTools สร้างขึ้นโดย Kenneth Auchenberg เพื่อพยายามนำ devtools ออกจากเบราว์เซอร์ - ในกรณีนี้ออกจากเบราว์เซอร์ Chrome แอปพลิเคชั่นนี้สร้างจาก NW.js และสามารถทำงานบน Mac OS X ได้เช่นเดียวกับ Linux และ Windows.
มีสาเหตุหลายประการที่กระตุ้นให้ผู้สร้างสร้าง แต่วิสัยทัศน์ของเขาประกอบด้วยการให้ความสะดวกแก่นักพัฒนา การดีบักแบบรีโมตผ่านหลายเบราว์เซอร์ทั้งหมดจากแพลตฟอร์มรวม (แอป) เดียวกัน. แนวคิดจะใช้เวลาสักครู่ในการติดตามและเป็นรูปธรรมเนื่องจากเหตุผลหลายประการ (และการต่อต้านซึ่งคุณสามารถอ่านได้ที่บล็อกของเขา).
เราจะพิจารณาสั้น ๆ เกี่ยวกับแอป Chrome DevTools และดูว่า Google มีอะไรให้นักพัฒนา.
เพิ่มเติมเกี่ยวกับ Hongkiat:
- เริ่มต้นใช้งานเครื่องมือสำหรับนักพัฒนาซอฟต์แวร์ Chrome
- 5 (เพิ่มเติม) เคล็ดลับ Chrome DevTools ที่เป็นประโยชน์สำหรับนักพัฒนา
- วิธีปรับแต่งธีมของ Google Chrome DevTools
การติดตั้ง
ดาวน์โหลด Chrome-Devtools.app.zip และแตกไฟล์ ดับเบิลคลิกเพื่อเรียกใช้ เริ่มเบราว์เซอร์ Chrome ของคุณและเปิดใช้งานการดีบักแบบรีโมท.
หากต้องการทำสิ่งนี้บน Mac ให้เปิดเทอร์มินัลแล้วเรียกใช้คำสั่งด้านล่าง:
sudo / Applications / Google \ Chrome.app/Contents/MacOS/Google \ Chrome -remote-debugging-port = 9222
หากคุณเรียกใช้ windows ให้เปิดพร้อมท์คำสั่งและใช้คำสั่งนี้:
เริ่ม chrome.exe -remote-debugging-port = 9222
วิธีใช้
เมื่อ Chrome ของคุณเปิดอยู่แล้วโดยเปิดใช้งานคุณสมบัติการดีบักระยะไกลคุณสามารถเรียกดูไซต์ใด ๆ ตัวอย่างเช่นเราเปิด Hongkiat.com สำหรับแบบฝึกหัดนี้ ต่อไปเราจะไปที่หน้าต่างแอป Chrome DevTools และ รีเฟรชรายการนี้ (ปุ่มอยู่ด้านขวาล่าง).
ตอนนี้คุณจะเห็นลิงค์ Hongkiat.com (ดังแสดงด้านล่าง).
ตอนนี้ คลิกปุ่ม 'ไป'. คุณจะถูกนำไปที่หน้าต่างใหม่ แค่นั้นแหละ. คุณมีแอป Chrome DevTools และเปิดใช้งานอยู่แล้ว สิ่งที่คุณจะเห็นที่นี่เหมือนกับเมื่อคุณ "ตรวจสอบองค์ประกอบ" 'บนเบราว์เซอร์ Chrome.
และจากที่นี่คุณสามารถใช้แอป Chrome DevTools ได้เช่นเดียวกับการใช้ DevTools บน Chrome โดยกำเนิด: คุณสามารถตรวจสอบองค์ประกอบ DOM, ดีบัก JavaScript, ทำงานกับคอนโซลและอื่น ๆ.
อะไรต่อไป?
แอปนี้ยังทดลองอยู่มาก แต่ตอนนี้แนวคิดในการนำ DevTool ออกจาก Chrome ช่วยให้นักพัฒนาสามารถจัดการแอปเป็นตัวแก้ไขการทำงานและทำงานร่วมกับ runtimes อื่น ๆ เช่น node.js และ iOS สำหรับความเป็นไปได้เพิ่มเติมคุณสามารถตรวจสอบรถไฟแห่งความคิดของ Auchenberg ได้ที่นี่.
