ספרים
TypeScript
פרק 9. בדיקות וניפוי שגיאות
שימוש בדיבאגר

TypeScript:
שימוש בדיבאגר

איך ל:

כדי להתחיל לעבוד עם מנפה בTypeScript, כל מה שאתה צריך זה IDE נתמך (כמו Visual Studio Code) וקובץ תצורה launch.json. הנה דוגמה מהירה ליישום Node.js:

// app.ts
function greet(name: string) {
    console.log(`שלום, ${name}!`);
}

const userName = 'Ada';
greet(userName);

כדי לנפות את זה, צור קובץ launch.json תחת תיקיית ה.vscode:

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "הפעלת תוכנית",
            "skipFiles": ["<node_internals>/**"],
            "program": "${workspaceFolder}/app.ts",
            "preLaunchTask": "tsc: build - tsconfig.json",
            "outFiles": ["${workspaceFolder}/build/**/*.js"]
        }
    ]
}

לאחר מכן, הגדר נקודת עצירה בפונקציה greet שלך על ידי לחיצה על צד שמאל של מספר השורה ב-IDE שלך. לחץ על F5 כדי להתחיל בניפוי, ותצפה כיצד האפליקציה שלך עוצרת בנקודת העצירה. כעת אתה יכול להרחיף מעל משתנים, לצפות בביטויים, ולצעוד דרך הקוד שלך בקלות.

צלילה עמוקה

בימים שלפני שסביבות הפיתוח המשולבות (IDEs) הפכו חלקות, ניפוי היה לעיתים קרובות נעשה באמצעות הודעות הדפסה (ידוע גם כconsole.log debugging). זה עבד, במידת מה, אך היה כמו לנסות למצוא מחט בערמת קש מחובש.

מנפים מודרניים הם כמו סכין שוויצרית לפתרון בעיות. עם התפתחות TypeScript ו-Node.js, ישנם מנפים שונים זמינים, החל ממפקח הפנימי של Node.js ועד לכלים פיתוחיים של הדפדפן לניפוי בצד הלקוח.

מפקח ה-Node.js פועל על ידי התחברות ליישום הרץ שלך; הוא מתקשר דרך פרוטוקול Chrome DevTools, הופך את הדפדפן Chrome שלך לקונסולת ניפוי עוצמתית. האינטגרציה הזו מאפשרת מושב ניפוי מפורט ואינטראקטיבי מבחינה חזותית, לעומת הנהלים מסורתיים של ניפוי בשורת הפקודה.

ראה גם

לקריאה נוספת וכמה טיפים מקצועיים, בדוק את:

שימוש במעטפת אינטראקטיבית (REPL)כתיבת בדיקות