reactjs - איך לגרום ל-VSCode להציג שגיאות TypeScript עבור קבצים שלא פתוחים בעורך?

באפליקציית TypeScript/React שלי ב-[email , שגיאות קומפילציה של TS מוצגות רק בחלון ה-Problems עבור הקבצים שפתוחים בעורך VS Code. כתוצאה מכך, לעיתים אני לא תופס את השגיאות עד שאני באמת מריץ את האפליקציה.

איך אני יכול לגרום ל-TypeScript לבדוק אוטומטית שגיאות קומפילציה בכל קבצי הקוד ברגע שאני פותח את סביבת העבודה, או כשאני שומר שינויים בקובץ?

ניסיתי להוסיף "watch": "tsc --watch" כסקריפט ב-package.json ואז להריץ npm run-script watch בחלון מסוף משולב, אבל יש לכך שתי בעיות:

• שגיאות מופיעות בלוח הטרמינל אך אינן מתמלאות בלוח הבעיות ב-VSCode
• אני צריך להפעיל את זה ידנית, במקום שזה יתחיל אוטומטית כשסביבת העבודה נטענת

האם יש פתרון טוב יותר?

אגב, זה אותו שאלה כמו 'הצג בעיות/שגיאות TypeScript בפרויקט כולו ב-WebStorm', אבל לגבי Visual Studio Code במקום WebStorm.

תשובה #1

נכון ל-24.10.2023 קיימת תכונה ניסיונית ב-VS Code הזמינה באופן כללי שמאפשרת דיווח בעיות בכל הפרויקט. הוסף את הבא ל-settings.json שלך:

"typescript.tsserver.experimental.enableProjectDiagnostics": true

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

אנשים מדווחים שהאופציה הזו סורקת את התוכן של node_modules למרות שהיא נמצאת ברשימת exclude, אבל הוספת 'skipLibCheck' עוזרת

תעקוב אחרי המקום הזה.

תשובה #2

נכון לנובמבר 2019, למרבה הצער זה אינו נתמך ב-VS Code כברירת מחדל. ראה https://github.com/Microsoft/vscode/issues/13953.

הפתרון הטוב ביותר שמצאתי הוא להוסיף משימה ל-tasks.json שתפעיל tsc --watch, ולהגדיר אותה לרוץ כאשר סביבת העבודה או התיקייה נפתחים.

להלן דוגמת קובץ קונפיגורציה עבור tasks.json. שים לב ש־"www" בקודמטלה למטה מתייחס לתיקייה עם tsconfig.json שברצונך לבדוק. החלף אותו בשם התיקייה שלך, ביחס לשורש סביבת העבודה שלך.

{
    "version": "2.0.0",
    "tasks": [
        {
            "label": "tsc watch",
            "type": "shell",
            "command": "./node_modules/.bin/tsc",
            "isBackground": true,
            "args": ["--watch", "--noEmit", "--project", "www"],
            "group": {
                "kind": "build",
                "isDefault": true
            },
            "presentation": {
                "reveal": "never",
                "echo": false,
                "focus": false,
                "panel": "dedicated"
            },
            "problemMatcher": "$tsc-watch",
            "runOptions": {
                "runOn": "folderOpen"
            }
        }
    ]
}

שימו לב שהמשימות להרצה אוטומטית לא נראות כמופעלות כברירת מחדל. כדי לבחור להצטרף למשימות להרצה אוטומטית, עקבו אחרי ההוראות כאן: https://stackoverflow.com/a/58866185/126352

פתרון זה הופעל מתוך התשובה של @molinx בסוגיית GitHub המקושרת למעלה, והוא שופר הודות להערתו של @kumar303 למטה.