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

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

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

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

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

אם זו הפעם הראשונה שאתם משתמשים ב-TypeScript, כדאי לעיין במאמר TypeScript ב-5 דקות.

איך מפעילים פרויקט 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 קיים, תוכלו להוסיף הוק לפני הפריסה כדי לוודא שהפרויקט עובר טרנספיילציה בכל פעם שאתם פורסים את הקוד ב-Cloud Functions for Firebase. תצטרכו קובץ tsconfig.json בפורמט תקין ופרויקט Firebase, ותצטרכו לבצע את השינויים הבאים בתצורה של Firebase:

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

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

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

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

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

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

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

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

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 ומגישות או מפעילות את מעטפת הפונקציות.

יומני Functions לפרויקטים של TypeScript

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