Używanie TypeScriptu w Cloud Functions

Programistom, którzy wolą pisać funkcje w języku TypeScript, dostępne są 2 typy funkcji Cloud Functions:

Utwórz i skonfiguruj projekty TypeScript do automatycznej transpilacji podczas inicjowania (firebase init functions).
Transpiluj istniejące źródło TypeScript do JavaScriptu podczas wdrażania za pomocą haczyka wstępnego wdrożenia.

Postępując zgodnie z instrukcjami w tym przewodniku, możesz przenieść istniejący projekt JavaScript do TypeScriptu i kontynuować wdrażanie funkcji za pomocą haczyka wstępnego wdrażania, które umożliwi transpilację kodu źródłowego. TypeScript ma wiele zalet w porównaniu z waniliowym JavaScriptem podczas pisania funkcji:

TypeScript obsługuje najnowsze funkcje JavaScriptu, takie jak asynchroniczny/oczekiwanie, upraszcza zarządzanie obietnicami
Linter Cloud Functions wyróżnia typowe problemy podczas kodowania
Bezpieczeństwo typu pomaga uniknąć błędów czasu działania we wdrożonych funkcjach

Jeśli dopiero zaczynasz korzystać z TypeScript, przeczytaj artykuł o korzystaniu z TypeScriptu w 5 minut.

Inicjowanie nowego projektu Cloud Functions za pomocą TypeScriptu

Uruchom firebase init functions w nowym katalogu. Narzędzie to ma różne opcje budowania projektu za pomocą JavaScriptu lub TypeScriptu. Wybierz TypeScript, aby wyświetlić następującą strukturę projektu:

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

Po zakończeniu inicjowania usuń znacznik komentarza z przykładu w index.ts i uruchom npm run serve, aby zobaczyć, jak działa funkcja „Hello World”.

Korzystanie z istniejącego projektu TypeScript

Jeśli masz istniejący projekt TypeScript, możesz dodać punkt zaczepienia przed wdrożeniem, aby mieć pewność, że projekt będzie transpilowany przy każdym wdrażaniu kodu w Cloud Functions dla Firebase. Potrzebujesz prawidłowo sformatowanego pliku tsconfig.json i projektu Firebase. Musisz wprowadzić w konfiguracji Firebase następujące zmiany:

Edytuj package.json, aby dodać skrypt bash umożliwiający utworzenie projektu TypeScript. Przykład:
```
 {
   "name": "functions",
   "scripts": {
     "build": "npm run lint && tsc"
   }
 ...
```
Edytuj firebase.json, aby dodać punkt zaczepienia przed wdrożeniem umożliwiający uruchomienie skryptu kompilacji. Przykład:
```
 {
   "functions": {
     "predeploy": "npm --prefix functions run build",
   }
 }
```

W przypadku tej konfiguracji polecenie firebase deploy --only functions tworzy kod TypeScript i wdraża go jako funkcje.

Migracja istniejącego projektu JavaScript do TypeScript

Jeśli masz istniejący projekt Cloud Functions, który został zainicjowany i stworzony w języku JavaScript, możesz go przenieść do TypeScript. Przed rozpoczęciem zdecydowanie zalecamy utworzenie punktu kontrolnego Git lub innej kopii zapasowej.

Aby przenieść istniejący projekt JavaScript Cloud Functions:

Utwórz punkt kontrolny git i zapisz kopie istniejących plików źródłowych JavaScript.
W katalogu projektu uruchom program firebase init functions i wybierz TypeScript, gdy pojawi się prośba o podanie języka pisania funkcji.
Gdy pojawi się pytanie, czy chcesz zastąpić istniejący plik package.json, wybierz Nie, chyba że na pewno nie chcesz zachować istniejącego pliku.
Usuń plik index.ts z katalogu functions/src, zastępując go istniejącym kodem źródłowym.
W pliku tsconfig.json utworzonym podczas inicjowania ustaw opcje kompilatora tak, aby zezwalały na kod JavaScript: "allowJs": true.
Skopiuj zapisany plik package.json do katalogu functions i edytuj go, ustawiając "main" na "lib/index.js".

Także w package.json dodaj skrypt kompilacji dla TypeScriptu:

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

Dodaj "typescript" jako zależność deweloperską, uruchamiając polecenie npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser.
W przypadku wszystkich zależności uruchom polecenie npm install --save @types/<dependency>.
W razie potrzeby zmień kod źródłowy z .js na .ts.

Emulowanie funkcji TypeScript

Aby przetestować funkcje TypeScript lokalnie, możesz użyć narzędzi do emulacji opisanych w artykule Uruchamianie funkcji lokalnie. Przed użyciem tych narzędzi ważne jest skompilowanie kodu, dlatego przed uruchomieniem firebase emulators:start lub firebase functions:shell uruchom polecenie npm run build w katalogu funkcji. Możesz też uruchomić npm run serve lub npm run shell jako skrót. Te polecenia uruchamiają kompilację oraz wyświetlają lub uruchamiają powłokę funkcji.

Logi funkcji dla projektów TypeScript

W czasie firebase deploy projekt index.ts projektu jest transpilowany do postaci index.js, co oznacza, że dziennik Cloud Functions będzie wyświetlać numery wierszy z pliku index.js, a nie z napisanego przez Ciebie kodu. Aby ułatwić Ci znajdowanie odpowiednich ścieżek i numerów wierszy w polu index.ts, firebase deploy tworzy functions/lib/index.js.map. Możesz użyć tej mapy źródłowej w preferowanym IDE lub za pomocą modułu węzła.