Catch up on everthing we announced at this year's Firebase Summit. Learn more

Użyj TypeScript dla Cloud Functions

Programistom, którzy wolą pisać funkcje w języku TypeScript, Cloud Functions zapewnia dwa rodzaje wsparcia:

  • Tworzenie projektów i konfigurowanie maszynopis automatycznego transpilation przy inicjalizacji ( firebase init functions ).
  • Transpile istniejącego źródła maszynopis do JavaScript w czasie deploy za pomocą haka predeploy .

Postępując zgodnie z instrukcjami w tym przewodniku, możesz przeprowadzić migrację istniejącego projektu JavaScript do TypeScript i kontynuować wdrażanie funkcji przy użyciu zaczepu predeploy 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 zwraca uwagę na typowe problemy podczas kodowania
  • Bezpieczeństwo typu pomaga uniknąć błędów w czasie wykonywania we wdrożonych funkcjach

Jeśli jesteś nowy w maszynopisie, zobacz maszynopis w 5 minut .

Inicjowanie nowego projektu Cloud Functions za pomocą TypeScript

Run firebase init functions w nowym katalogu. Narzędzie daje opcje budowania projektu za pomocą JavaScript lub TypeScript. Wybierz maszynopis do wyjścia 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óbka w index.ts i run npm run serve zobaczyć funkcję „Hello World” w akcji.

Korzystanie z istniejącego projektu TypeScript

Jeśli masz istniejący projekt TypeScript, możesz dodać punkt zaczepienia przed wdrożeniem, aby upewnić się, że projekt jest transpilowany za każdym razem, gdy wdrażasz kod w Cloud Functions dla Firebase. Musisz odpowiednio uformowaną tsconfig.json plik i projekt Firebase i trzeba wprowadzić następujące zmiany do Firebase konfiguracji:

  1. Edycja package.json dodać skrypt bash, aby zbudować swój projekt maszynopis. Na przykład:

     {
       "name": "functions",
       "scripts": {
         "build": "npm run lint && tsc"
       }
     ...
    
  2. Edycja firebase.json dodać hak predeploy aby uruchomić skrypt kompilacji. Na przykład:

     {
       "functions": {
         "predeploy": "npm --prefix functions run build",
       }
     }
    

Przy tej konfiguracji firebase deploy --only functions komenda buduje swój kod maszynopis i wykorzystuje go jako funkcje.

Migracja istniejącego projektu JavaScript do TypeScript

Jeśli masz istniejący projekt Cloud Functions, który zainicjowałeś i opracowałeś w JavaScript, możesz przenieść go do TypeScript. Zdecydowanie zachęcamy do utworzenia punktu kontrolnego git lub innej kopii zapasowej przed rozpoczęciem.

Aby przeprowadzić migrację istniejącego projektu JavaScript Cloud Functions:

  1. Utwórz punkt kontrolny git i zapisz kopie istniejących plików źródłowych JavaScript.
  2. W katalogu projektu, uruchom firebase init functions i wybierz TypeScript kiedy poproszony o języku do pisania funkcji.
  3. Gdy pojawi się monit, czy zastąpić istniejący package.json plik, wybierz No chyba że jesteś pewien, że nie chcesz zachować istniejący plik.
  4. Usuwanie index.ts w katalogu functions/src , zastępując ją z istniejącym kodem źródłowym.
  5. W tsconfig.json pliku utworzonego przy inicjalizacji ustawić opcje kompilatora, aby umożliwić javascript: "allowJs": true .
  6. Skopiować zapisany package.json plik do functions katalogu i edytować go, aby ustawić "main" do "lib/index.js" .
  7. Również w package.json , dodać skrypt kompilacji dla maszynopis jak poniżej:

     {
       "name": "functions",
       "scripts": {
         "build": "npm run lint && tsc"
       }
     ...
    
  8. Dodaj "typescript" jako zależność dev uruchamiając npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser .

  9. Dla wszystkich zależności, prowadzony npm install --save @types/<dependency> .

  10. Przepisz kod źródłowy z .js na .ts zgodnie z potrzebami.

Emulowanie funkcji TypeScript

Do funkcji Test maszynopis lokalnie, można użyć narzędzia emulacji opisane funkcje mogą być uruchamiane lokalnie . Ważne jest, aby skompilować kodu przed użyciem tych narzędzi, więc upewnij się, aby uruchomić npm run build wewnątrz katalogu funkcji przed uruchomieniem firebase emulators:start lub firebase functions:shell . Alternatywnie, należy uruchomić npm run serve lub npm run shell jako skrót; te polecenia zarówno uruchamiają budowanie, jak i udostępniają/uruchamiają powłokę funkcji.

Dzienniki funkcji dla projektów TypeScript

Podczas firebase deploy , projekt jest index.ts jest transpiled do index.js , co oznacza, że funkcje chmura dziennika numery linii wyjście będzie od index.js pliku, a nie kodu napisałeś. Aby ułatwić Ci znalezienie odpowiednich ścieżek i numery linii w index.ts , firebase deploy tworzy functions/lib/index.js.map . Można użyć tego źródła mapę w wybranym IDE lub poprzez moduł węzła .