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

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

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

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

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

אם אתם חדשים ב-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 כדי להוסיף וו לפני פריסה להרצת סקריפט הבנייה. לדוגמה:

     {
       "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. מריצים את הפקודה npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser כדי להוסיף את "typescript" כתלות בפיתוח.

  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 כקיצור דרך. שתי הפקודות האלה מריצות את הבנייה ומפעילות את מעטפת הפונקציות.

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

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