שימוש ב-TypeScript ל-Cloud Functions

למפתחים שמעדיפים לכתוב פונקציות ב-TypeScript, ‏Cloud Functions מספק שני סוגי תמיכה:

• ליצור ולהגדיר פרויקטים של TypeScript לטרנספילציה אוטומטית בזמן האתחול (firebase init functions).
• לבצע טרנספילציה של קוד מקור קיים של TypeScript ל-JavaScript בזמן הפריסה באמצעות הוק (hook) לפני פריסה.

בעזרת ההוראות במדריך הזה, אתם יכולים להעביר פרויקט JavaScript קיים ל-TypeScript ולהמשיך לפרוס פונקציות באמצעות הוק (hook) לפני פריסה כדי לבצע טרנספילציה של קוד המקור. ל-TypeScript יש יתרונות רבים על פני JavaScript רגיל כשכותבים פונקציות:

• ‫TypeScript תומכת בתכונות העדכניות ביותר של JavaScript, כמו async/await, ומפשטת את ניהול ההבטחות (promises)
• כלי לניתוח קוד סטטי (linter) של Cloud Functions מדגיש בעיות נפוצות בזמן כתיבת הקוד
• מניעת שגיאות הקלדה עוזרת להימנע משגיאות זמן ריצה בפונקציות שנפרסו

אם אתם לא מכירים את TypeScript, כדאי לעיין במדריך TypeScript in 5 minutes.

הפעלה של פרויקט Cloud Functions חדש עם TypeScript

מריצים את firebase init functions בספרייה חדשה. הכלי מאפשר לכם לבנות את הפרויקט באמצעות JavaScript או TypeScript. בוחרים באפשרות TypeScript כדי ליצור את מבנה הפרויקט הבא:

myproject
 +- functions/     # Directory containing all your functions code
      |
      +- package.json  # npm package file describing your Cloud Functions code
      |
      +- tsconfig.json
      |
      +- .eslintrc.js # Optional file if you enabled ESLint
      +- tsconfig.dev.json # Optional file that references .eslintrc.js
      |
      +- src/     # Directory containing TypeScript source
      |   |
      |   +- index.ts  # main source file for your Cloud Functions code
      |
      +- lib/
          |
          +- index.js  # Built/transpiled JavaScript code
          |
          +- index.js.map # Source map for debugging

בסיום תהליך האתחול, מבטלים את הסימון של הדוגמה ב-index.ts ומריצים את npm run serve כדי לראות את הפונקציה Hello World בפעולה.

שימוש בפרויקט TypeScript קיים

אם יש לכם פרויקט קיים ב-TypeScript, אתם יכולים להוסיף הוק (hook) לפני הפריסה כדי לוודא שהפרויקט עובר טרנספילציה בכל פעם שאתם פורסים את הקוד ב-Cloud Functions for Firebase. צריך קובץ tsconfig.json בפורמט תקין ופרויקט ב-Firebase, וצריך לבצע את השינויים הבאים בהגדרות של Firebase:

1. עורכים את package.json כדי להוסיף סקריפט Bash לבניית פרויקט TypeScript. לדוגמה:

    {
      "name": "functions",
      "scripts": {
        "build": "npm run lint && tsc"
      }
    ...
   

2. עורכים את firebase.json כדי להוסיף הוק (hook) לפני הפריסה שיריץ את הסקריפט של ה-build. לדוגמה:

    {
      "functions": {
        "predeploy": "npm --prefix functions run build",
      }
    }
   

בהגדרה הזו, הפקודה firebase deploy --only functions יוצרת את קוד ה-TypeScript ופורסת אותו כפונקציות.

העברת פרויקט JavaScript קיים ל-TypeScript

אם יש לכם פרויקט קיים ב-Cloud Functions שהפעלתם ופיתחתם ב-JavaScript, אתם יכולים להעביר אותו ל-TypeScript. מומלץ מאוד ליצור נקודת ביקורת ב-Git או גיבוי אחר לפני שמתחילים.

כדי להעביר פרויקט קיים ב-JavaScript Cloud Functions:

1. יוצרים נקודת ביקורת ב-Git ושומרים עותקים של קובצי המקור הקיימים ב-JavaScript.
2. בספריית הפרויקט, מריצים את firebase init functions ובוחרים באפשרות TypeScript כשמופיעה בקשה לבחור שפה לכתיבת פונקציות.
3. כשנשאלים אם להחליף את הקובץ הקיים package.json, בוחרים באפשרות לא, אלא אם בטוחים שלא רוצים לשמור את הקובץ הקיים.
4. מוחקים את index.ts בספרייה functions/src ומחליפים אותו בקוד המקור הקיים.
5. בקובץ tsconfig.json שנוצר במהלך ההפעלה, מגדירים את אפשרויות הקומפיילר כך שיאפשרו JavaScript: ‏"allowJs": true.
6. מעתיקים את קובץ package.json השמור לספרייה functions, ועורכים אותו כדי להגדיר את "main" ל-"lib/index.js".

7. גם בקובץ package.json, מוסיפים סקריפט build ל-TypeScript, כמו בדוגמה הבאה:

    {
      "name": "functions",
      "scripts": {
        "build": "npm run lint && tsc"
      }
    ...
   

8. מוסיפים את "typescript" כתלות בפיתוח על ידי הפעלת npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser.

9. כדי להתקין את כל יחסי התלות, מריצים את הפקודה npm install --save @types/<dependency>.

10. משכתבים את קוד המקור מ-‎ .js ל-‎ .ts לפי הצורך.

הדמיה של פונקציות TypeScript

כדי לבדוק פונקציות TypeScript באופן מקומי, אפשר להשתמש בכלי האמולציה שמתוארים במאמר הרצת פונקציות באופן מקומי. חשוב להדר את הקוד לפני שמשתמשים בכלים האלה, לכן הקפידו להריץ את npm run build בתוך ספריית הפונקציות לפני שתריצו את firebase emulators:start או את firebase functions:shell. לחלופין, אפשר להריץ את npm run serve או את npm run shell כקיצור דרך. שתי הפקודות האלה מריצות את ה-build ומפעילות את מעטפת הפונקציות.

יומני פונקציות לפרויקטים ב-TypeScript

במהלך firebase deploy, מתבצעת טרנספילציה של index.ts בפרויקט ל-index.js, כלומר ביומן של Cloud Functions יוצגו מספרי שורות מהקובץ index.js ולא מהקוד שכתבתם. כדי שיהיה קל יותר למצוא את הנתיבים ומספרי השורות התואמים ב-index.ts, הכלי firebase deploy יוצר את functions/lib/index.js.map. אתם יכולים להשתמש במפת המקור הזו בסביבת הפיתוח המשולבת (IDE) המועדפת עליכם או באמצעות מודול צומת.