Deweloperom, którzy wolą pisać funkcje w TypeScript,Cloud Functions udostępniamy 2 rodzaje pomocy:
- Tworzenie i konfigurowanie projektów TypeScript na potrzeby automatycznej transpilacji podczas inicjowania (
firebase init functions
). - Przekształć istniejący kod źródłowy TypeScript na JavaScript w momencie wdrażania za pomocą haczyka przed wdrożeniem.
Postępując zgodnie z instrukcjami w tym przewodniku, możesz przenieść istniejący projekt JavaScript do TypeScriptu i nadal wdrażać funkcje za pomocą haka przed wdrożeniem, aby transpilować kod źródłowy. TypeScript ma wiele zalet w porównaniu ze zwykłym JavaScriptem podczas pisania funkcji:
- TypeScript obsługuje najnowsze funkcje JavaScriptu, takie jak async/await, co upraszcza zarządzanie obietnicami.
- Cloud FunctionsLinter wyróżnia typowe problemy podczas pisania kodu.
- Bezpieczeństwo typów pomaga uniknąć błędów środowiska wykonawczego w wdrożonych funkcjach.
Jeśli dopiero zaczynasz korzystać z TypeScript, przeczytaj artykuł TypeScript w 5 minut.
Inicjowanie nowego projektu Cloud Functions w TypeScript
Uruchom firebase init functions
w nowym katalogu. Narzędzie umożliwia tworzenie projektu w JavaScript lub TypeScript. Wybierz TypeScript, aby uzyskać 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 odkomentuj próbkę w pliku index.ts i uruchom polecenie
npm run serve
, aby zobaczyć działanie funkcji „Hello World”.
Korzystanie z istniejącego projektu TypeScript
Jeśli masz już projekt w TypeScript, możesz dodać do niego hooka predeploy, aby mieć pewność, że projekt będzie transpilowany za każdym razem, gdy wdrażasz kod w Cloud Functions for Firebase. Musisz mieć prawidłowo sformatowany plik tsconfig.json
i projekt Firebase oraz wprowadzić w konfiguracji Firebase te zmiany:
Edytuj
package.json
, aby dodać skrypt bash do tworzenia projektu TypeScript. Przykład:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Edytuj
firebase.json
, aby dodać wywołanie predeploy, które uruchomi skrypt kompilacji. Przykład:{ "functions": { "predeploy": "npm --prefix functions run build", } }
W tej konfiguracji polecenie firebase deploy --only functions
kompiluje kod TypeScript i wdraża go jako funkcje.
Migrowanie istniejącego projektu JavaScript na TypeScript
Jeśli masz istniejący Cloud Functions projekt zainicjowany i opracowany w JavaScript, możesz go przenieść do TypeScriptu. Zanim zaczniesz, 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 polecenie
firebase init functions
i gdy pojawi się prośba o wybranie języka do pisania funkcji, wybierzTypeScript
. - Gdy pojawi się pytanie, czy chcesz zastąpić istniejący plik
package.json
, kliknij Nie, chyba że nie chcesz zachować istniejącego pliku. - Usuń
index.ts
w katalogufunctions/src
i zastąp go dotychczasowym kodem źródłowym. - W pliku
tsconfig.json
utworzonym podczas inicjowania ustaw opcje kompilatora, aby zezwalać na JavaScript:"allowJs": true
. - Skopiuj zapisany plik
package.json
do katalogufunctions
i edytuj go, aby ustawić wartość"main"
na"lib/index.js"
. W
package.json
dodaj też skrypt kompilacji dla TypeScriptu, np. taki:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Dodaj
"typescript"
jako zależność deweloperską, uruchamiającnpm 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 przepisz kod źródłowy z pliku .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 musisz skompilować kod, więc przed uruchomieniem polecenia firebase emulators:start
lub firebase functions:shell
uruchom polecenie npm run build
w katalogu funkcji. Możesz też użyć skrótu npm run serve
lub npm run shell
. Oba te polecenia uruchamiają kompilację i serwer/powłokę funkcji.
Logi funkcji w projektach TypeScript
Podczas firebase deploy
kod index.ts
w Twoim projekcie jest transpilowany do index.js
, co oznacza, że w logu Cloud Functions będą wyświetlane 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 index.ts
, firebase deploy
tworzy functions/lib/index.js.map
. Możesz użyć tej mapy źródła w preferowanym środowisku IDE lub za pomocą modułu węzła.