Deweloperzy, którzy wolą pisać funkcje w języku TypeScript, mogą skorzystać z tych 2 typów obsługi:Cloud Functions
- Tworzenie i konfigurowanie projektów TypeScript w celu automatycznego transpilowania podczas inicjalizacji (
firebase init functions
). - Przetłumacz istniejący kod źródłowy TypeScript na JavaScript w momencie wdrożenia za pomocą haka przed wdrożeniem.
Postępując zgodnie z instrukcjami w tym przewodniku, możesz przenieść istniejący projekt JavaScriptu do TypeScriptu i nadal wdrażać funkcje za pomocą przedwdrożeniowego haczyka do transpilacji kodu źródłowego. TypeScript oferuje wiele korzyści w porównaniu z tradycyjnym JavaScriptem podczas pisania funkcji:
- TypeScript obsługuje najnowsze funkcje JavaScriptu, takie jak async/await, upraszczając zarządzanie obietnicami
- Podczas pisania kodu narzędzie Cloud Functions linter podświetla typowe problemy
- Bezpieczeństwo typów pomaga unikać błędów w czasie wykonywania wdrożonych funkcji
Jeśli nie znasz języka TypeScript, przeczytaj artykuł TypeScript w 5 minut.
Inicjowanie nowego projektu Cloud Functions za pomocą TypeScript
Uruchom firebase init functions
w nowym katalogu. Narzędzia te umożliwiają kompilowanie projektu za pomocą JavaScriptu lub TypeScriptu. Wybierz TypeScript, aby wygenerować tę 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 przykład w pliku index.ts i uruchom go, aby zobaczyć działanie funkcji „Hello World”:npm run serve
.
Korzystanie z istniejącego projektu TypeScript
Jeśli masz już projekt TypeScript, możesz dodać do niego haczyk przed wdrożeniem, aby za każdym razem, gdy wdrażasz kod do Cloud Functions for Firebase, był on najpierw kompilowany. Potrzebujesz prawidłowo sformatowanego pliku tsconfig.json
i projektu Firebase. Musisz też wprowadzić w konfiguracji Firebase te zmiany:
Kliknij Edytuj
package.json
, aby dodać skrypt bash do kompilacji projektu TypeScript. Przykład:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Kliknij Edytuj
firebase.json
, aby dodać element przedwdrożeniowy, który uruchamia 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.
Migracja istniejącego projektu JavaScript na TypeScript
Jeśli masz istniejący projekt Cloud Functions, który został zainicjowany i opracowany w JavaScript, możesz go przenieść do TypeScript. Przed rozpoczęciem zalecamy utworzenie punktu kontrolnego git lub innego rodzaju kopii zapasowej.
Aby przenieść istniejący projekt JavaScript Cloud Functions:
- Utwórz punkt kontrolny git i zapisz kopie dotychczasowych plików źródłowych JavaScript.
- W katalogu projektu uruchom
firebase init functions
i wybierzTypeScript
, gdy pojawi się prośba o wybór języka do pisania funkcji. - Gdy pojawi się pytanie, czy chcesz zastąpić istniejący plik
package.json
, wybierz Nie, chyba że masz pewność, że nie chcesz zachować istniejącego pliku. - Usuń
index.ts
w katalogufunctions/src
, zastępując go dotychczasowym kodem źródłowym. - W pliku
tsconfig.json
utworzonym podczas inicjalizacji ustaw opcje kompilatora, aby zezwolić na JavaScript:"allowJs": true
. - Skopiuj zapisany plik
package.json
do katalogufunctions
i zmodyfikuj go tak, aby wartość"main"
miała wartość"lib/index.js"
. W sekcji
package.json
dodaj skrypt kompilacji TypeScript, np. taki:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Dodaj
"typescript"
jako zależność programistyczną, uruchamiającnpm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser
.Aby sprawdzić wszystkie zależności, uruchom
npm install --save @types/<dependency>
.W razie potrzeby przepisz kod źródłowy z rozszerzenia .js na .ts.
Emulowanie funkcji TypeScript
Aby testować 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 zanim uruchomisz firebase emulators:start
lub firebase functions:shell
, uruchom npm run build
w katalogu funkcji. Możesz też uruchomić polecenie npm run serve
lub npm run shell
jako skrót. Oba te polecenia uruchamiają kompilację i uruchamiają lub uruchamiają ponownie powłokę funkcji.
Logi funkcji w przypadku projektów TypeScript
Podczas firebase deploy
funkcja index.ts
Twojego projektu jest kompilowana na index.js
, co oznacza, że dziennik funkcji w chmurze będzie zawierać numery wierszy z pliku index.js
, a nie z Twojego kodu. Aby ułatwić znajdowanie odpowiednich ścieżek i numerów linii w pliku index.ts
, funkcja firebase deploy
tworzy plik functions/lib/index.js.map
. Możesz użyć tej mapy źródeł w ulubionym środowisku IDE lub za pomocą modułu node.