Programistom, którzy wolą pisać funkcje w języku TypeScript, Cloud Functions zapewnia dwa rodzaje wsparcia:
- Twórz i konfiguruj projekty TypeScript do automatycznej transpilacji podczas inicjalizacji (
firebase init functions
). - Transpiluj istniejące źródło TypeScriptu na JavaScript w czasie wdrażania za pomocą haka przed wdrożeniem .
Postępując zgodnie z instrukcjami zawartymi w tym przewodniku, możesz migrować istniejący projekt JavaScript do TypeScript i kontynuować wdrażanie funkcji przy użyciu haka przed wdrożeniem w celu transpilacji kodu źródłowego. TypeScript oferuje wiele korzyści w porównaniu z waniliowym JavaScriptem podczas pisania funkcji:
- TypeScript obsługuje najnowsze funkcje JavaScript, takie jak async/await, upraszczając zarządzanie obietnicami
- Linter Cloud Functions podkreśla typowe problemy podczas kodowania
- Bezpieczeństwo typów pomaga uniknąć błędów w czasie wykonywania we wdrożonych funkcjach
Jeśli dopiero zaczynasz przygodę z TypeScriptem, zobacz TypeScript w 5 minut .
Inicjowanie nowego projektu Cloud Functions za pomocą TypeScript
Uruchom firebase init functions
w nowym katalogu. Narzędzie daje możliwość zbudowania projektu za pomocą JavaScript lub TypeScript. 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 inicjalizacji odkomentuj próbkę w pliku Index.ts i uruchom npm run serve
, aby zobaczyć funkcję „Hello World” w akcji.
Korzystanie z istniejącego projektu TypeScript
Jeśli masz istniejący projekt TypeScript, możesz dodać hak przed wdrożeniem, aby mieć pewność, że projekt będzie transpilowany za każdym razem, gdy wdrażasz kod w Cloud Functions dla Firebase. Będziesz potrzebował poprawnie utworzonego pliku tsconfig.json
i projektu Firebase, a także musisz wprowadzić następujące modyfikacje w konfiguracji Firebase:
Edytuj
package.json
, aby dodać skrypt bash do zbudowania projektu TypeScript. Na przykład:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Edytuj
firebase.json
, aby dodać hak przed wdrożeniem w celu uruchomienia skryptu kompilacji. Na przykład:{ "functions": { "predeploy": "npm --prefix functions run build", } }
W tej konfiguracji polecenie firebase deploy --only functions
buduje 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 opracowany w języku JavaScript, możesz przeprowadzić migrację go do TypeScript. Zdecydowanie zalecamy utworzenie punktu kontrolnego git lub innej kopii zapasowej przed rozpoczęciem.
Aby przeprowadzić migrację istniejącego projektu JavaScript Cloud Functions:
- Utwórz punkt kontrolny git i zapisz kopie istniejących plików źródłowych JavaScript.
- W katalogu projektu uruchom
firebase init functions
i wybierzTypeScript
, gdy pojawi się monit o język do pisania funkcji. - Po wyświetleniu monitu o zastąpienie istniejącego pliku
package.json
wybierz opcję Nie , chyba że masz pewność, że nie chcesz zachować istniejącego pliku. - Usuń plik
index.ts
zfunctions/src
, zastępując go istniejącym kodem źródłowym. - W pliku
tsconfig.json
utworzonym podczas inicjalizacji ustaw opcje kompilatora tak, aby zezwalał na JavaScript:"allowJs": true
. - Skopiuj zapisany plik
package.json
do katalogufunctions
i edytuj go, ustawiając"main"
na"lib/index.js"
. Również w
package.json
dodaj skrypt kompilacji dla TypeScript, jak poniżej:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Dodaj
"typescript"
jako zależność programisty, uruchamiającnpm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser
.Dla wszystkich zależności uruchom
npm install --save @types/<dependency>
.Przepisz kod źródłowy z .js na .ts według potrzeb.
Emulowanie funkcji TypeScriptu
Aby lokalnie przetestować funkcje TypeScriptu, możesz użyć narzędzi emulacji opisanych w sekcji Uruchamianie funkcji lokalnie . Ważne jest, aby skompilować kod przed użyciem tych narzędzi, więc pamiętaj o uruchomieniu npm run build
w katalogu funkcji przed uruchomieniem firebase emulators:start
lub firebase functions:shell
. Alternatywnie uruchom jako skrót npm run serve
lub npm run shell
; te polecenia uruchamiają zarówno kompilację, jak i obsługują/uruchamiają powłokę funkcji.
Dzienniki funkcji dla projektów TypeScript
Podczas firebase deploy
index.ts
Twojego projektu jest transponowany do index.js
, co oznacza, że dziennik Cloud Functions wyświetli numery wierszy z pliku index.js
, a nie napisany przez Ciebie kod. Aby ułatwić Ci znalezienie odpowiednich ścieżek i numerów linii w index.ts
, firebase deploy
tworzy functions/lib/index.js.map
. Możesz użyć tej mapy źródłowej w preferowanym IDE lub poprzez moduł węzła .