Gunakan TypeScript untuk Cloud Functions

Bagi developer yang lebih suka menulis fungsi di TypeScript, Cloud Functions menyediakan dua jenis dukungan:

• Buat dan konfigurasikan proyek TypeScript untuk transpilasi otomatis saat inisialisasi ( firebase init functions ).
• Transpile sumber TypeScript yang ada ke JavaScript pada waktu penerapan melalui pengait prapenerapan .

Dengan mengikuti petunjuk dalam panduan ini, Anda dapat memigrasikan proyek JavaScript yang ada ke TypeScript dan terus menerapkan fungsi menggunakan pengait prapenerapan untuk mengubah kode sumber Anda. TypeScript menawarkan banyak manfaat dibandingkan vanilla JavaScript saat menulis fungsi:

• TypeScript mendukung fitur JavaScript terbaru seperti async/await, menyederhanakan manajemen janji
• Linter Cloud Functions menyoroti masalah umum saat Anda membuat kode
• Keamanan jenis membantu Anda menghindari kesalahan runtime dalam fungsi yang diterapkan

Jika Anda baru menggunakan TypeScript, lihat TypeScript dalam 5 menit .

Menginisialisasi proyek Cloud Functions baru dengan TypeScript

Jalankan firebase init functions di direktori baru. Alat ini memberi Anda opsi untuk membangun proyek dengan JavaScript atau TypeScript. Pilih TypeScript untuk menampilkan struktur proyek berikut:

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

Setelah inisialisasi selesai, batalkan komentar pada sampel di index.ts dan jalankan npm run serve untuk melihat fungsi "Hello World" beraksi.

Menggunakan proyek TypeScript yang ada

Jika Anda sudah memiliki project TypeScript, Anda dapat menambahkan hook pra-penerapan untuk memastikan project Anda ditranspilasikan setiap kali Anda menerapkan kode ke Cloud Functions for Firebase. Anda memerlukan file tsconfig.json yang dibuat dengan benar dan proyek Firebase, dan Anda harus melakukan modifikasi berikut pada konfigurasi Firebase Anda:

1. Edit package.json untuk menambahkan skrip bash untuk membangun proyek TypeScript Anda. Sebagai contoh:

    {
      "name": "functions",
      "scripts": {
        "build": "npm run lint && tsc"
      }
    ...
   

2. Edit firebase.json untuk menambahkan pengait pra-penerapan untuk menjalankan skrip build. Sebagai contoh:

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

Dengan konfigurasi ini, perintah firebase deploy --only functions akan membuat kode TypeScript Anda dan menerapkannya sebagai fungsi.

Memigrasi proyek JavaScript yang ada ke TypeScript

Jika Anda sudah memiliki project Cloud Functions yang diinisialisasi dan dikembangkan di JavaScript, Anda dapat memigrasikannya ke TypeScript. Anda sangat dianjurkan untuk membuat git checkpoint atau cadangan lainnya sebelum memulai.

Untuk memigrasikan project JavaScript Cloud Functions yang sudah ada:

1. Buat pos pemeriksaan git dan simpan salinan file sumber JavaScript yang ada.
2. Di direktori proyek, jalankan firebase init functions dan pilih TypeScript saat diminta bahasa untuk menulis fungsi.
3. Saat ditanya apakah akan menimpa file package.json yang ada, pilih No kecuali Anda yakin tidak ingin menyimpan file yang ada.
4. Hapus index.ts di direktori functions/src , ganti dengan kode sumber Anda yang sudah ada.
5. Dalam file tsconfig.json yang dibuat saat inisialisasi, setel opsi kompiler untuk mengizinkan JavaScript: "allowJs": true .
6. Salin file package.json Anda yang disimpan ke direktori functions , dan edit untuk menyetel "main" ke "lib/index.js" .

7. Juga di package.json , tambahkan skrip build untuk TypeScript seperti berikut:

    {
      "name": "functions",
      "scripts": {
        "build": "npm run lint && tsc"
      }
    ...
   

8. Tambahkan "typescript" sebagai dependensi dev dengan menjalankan npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser .

9. Untuk semua dependensi, jalankan npm install --save @types/<dependency> .

10. Tulis ulang kode sumber dari .js ke .ts sesuai keinginan.

Meniru fungsi TypeScript

Untuk menguji fungsi TypeScript secara lokal, Anda dapat menggunakan alat emulasi yang dijelaskan di Jalankan fungsi secara lokal . Penting untuk mengompilasi kode Anda sebelum menggunakan alat ini, jadi pastikan untuk menjalankan npm run build di dalam direktori functions Anda sebelum menjalankan firebase emulators:start atau firebase functions:shell . Alternatifnya, jalankan npm run serve atau npm run shell sebagai jalan pintas; perintah-perintah ini menjalankan build dan melayani/memulai fungsi shell.

Log fungsi untuk proyek TypeScript

Selama firebase deploy , index.ts project Anda diubah menjadi index.js , artinya log Cloud Functions akan menampilkan nomor baris dari file index.js dan bukan kode yang Anda tulis. Untuk memudahkan Anda menemukan jalur dan nomor baris yang sesuai di index.ts , firebase deploy membuat functions/lib/index.js.map . Anda dapat menggunakan peta sumber ini di IDE pilihan Anda atau melalui modul node .