Per gli sviluppatori che preferiscono scrivere funzioni in TypeScript, Cloud Functions fornisce due tipi di supporto:
- Crea e configura progetti TypeScript per la transpilazione automatica all'inizializzazione (
firebase init functions
). - Transpile l'origine TypeScript esistente in JavaScript al momento della distribuzione tramite un hook di predistribuzione .
Seguendo le istruzioni in questa guida, puoi eseguire la migrazione di un progetto JavaScript esistente a TypeScript e continuare a distribuire le funzioni utilizzando un hook di predistribuzione per trasferire il codice sorgente. TypeScript offre molti vantaggi rispetto a JavaScript vanilla durante la scrittura di funzioni:
- TypeScript supporta le funzionalità JavaScript più recenti come async/await, semplificando la gestione delle promesse
- Un linter di Cloud Functions evidenzia problemi comuni durante la codifica
- L'indipendenza dai tipi consente di evitare errori di runtime nelle funzioni distribuite
Se non conosci TypeScript, vedi TypeScript in 5 minuti .
Inizializzazione di un nuovo progetto Cloud Functions con TypeScript
Esegui firebase init functions
in una nuova directory. Lo strumento offre opzioni per creare il progetto con JavaScript o TypeScript. Scegli TypeScript per produrre la seguente struttura del progetto:
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
Una volta completata l'inizializzazione, decommenta l'esempio in index.ts ed esegui npm run serve
per vedere una funzione "Hello World" in azione.
Utilizzo di un progetto TypeScript esistente
Se disponi di un progetto TypeScript esistente, puoi aggiungere un hook di predistribuzione per assicurarti che venga eseguito il transpiling del progetto ogni volta che distribuisci il codice in Cloud Functions per Firebase. Avrai bisogno di un file tsconfig.json
formato correttamente e di un progetto Firebase e dovrai apportare le seguenti modifiche alla configurazione di Firebase:
Modifica
package.json
per aggiungere uno script bash per creare il tuo progetto TypeScript. Per esempio:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Modifica
firebase.json
per aggiungere un hook di predistribuzione per eseguire lo script di compilazione. Per esempio:{ "functions": { "predeploy": "npm --prefix functions run build", } }
Con questa configurazione, un comando firebase deploy --only functions
crea il tuo codice TypeScript e lo distribuisce come funzioni.
Migrazione di un progetto JavaScript esistente in TypeScript
Se disponi di un progetto Cloud Functions esistente che hai inizializzato e sviluppato in JavaScript, puoi eseguirne la migrazione a TypeScript. Ti consigliamo vivamente di creare un checkpoint git o un altro backup prima di iniziare.
Per eseguire la migrazione di un progetto JavaScript Cloud Functions esistente:
- Crea un checkpoint git e salva copie dei tuoi file sorgente JavaScript esistenti.
- Nella directory del progetto, esegui
firebase init functions
e selezionaTypeScript
quando viene richiesto un linguaggio per la scrittura delle funzioni. - Quando viene richiesto se sovrascrivere il file
package.json
esistente, selezionare No a meno che non si sia certi di non voler conservare il file esistente. - Elimina
index.ts
nella directoryfunctions/src
, sostituendolo con il codice sorgente esistente. - Nel file
tsconfig.json
creato durante l'inizializzazione, imposta le opzioni del compilatore per consentire JavaScript:"allowJs": true
. - Copia il file
package.json
salvato nella directoryfunctions
e modificalo per impostare"main"
su"lib/index.js"
. Anche in
package.json
, aggiungi uno script di compilazione per TypeScript come il seguente:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
Aggiungi
"typescript"
come dipendenza dev eseguendonpm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser
.Per tutte le dipendenze, esegui
npm install --save @types/<dependency>
.Riscrivi il codice sorgente da .js a .ts come desiderato.
Emulazione delle funzioni TypeScript
Per testare le funzioni di TypeScript in locale, puoi utilizzare gli strumenti di emulazione descritti in Eseguire le funzioni in locale . È importante compilare il codice prima di utilizzare questi strumenti, quindi assicurati di eseguire npm run build
all'interno della directory functions prima di eseguire firebase emulators:start
o firebase functions:shell
. In alternativa, esegui npm run serve
o npm run shell
come scorciatoia; questi comandi eseguono sia la build che servono/avviano la shell delle funzioni.
Log delle funzioni per i progetti TypeScript
Durante firebase deploy
, index.ts
del tuo progetto viene trasferito a index.js
, il che significa che il log di Cloud Functions restituirà i numeri di riga dal file index.js
e non il codice che hai scritto. Per semplificare la ricerca dei percorsi e dei numeri di riga corrispondenti in index.ts
, firebase deploy
crea functions/lib/index.js.map
. Puoi utilizzare questa mappa sorgente nel tuo IDE preferito o tramite un modulo nodo .