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

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

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

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

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

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

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

  2. כדי להוסיף הוק (hook) פריסה מראש להרצת סקריפט ה-build, עורכים את 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. אפשר להוסיף את "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) המועדפת עליכם או באמצעות מודול צומת.