Ikuti semua informasi yang diumumkan di Firebase Summit, dan pelajari bagaimana Firebase dapat membantu Anda mempercepat pengembangan aplikasi dan menjalankan aplikasi dengan percaya diri. Pelajari Lebih Lanjut

Gunakan TypeScript untuk Cloud Functions

Tetap teratur dengan koleksi Simpan dan kategorikan konten berdasarkan preferensi Anda.

Untuk pengembang 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 hook pra -penerapan.

Mengikuti petunjuk dalam panduan ini, Anda dapat memigrasikan proyek JavaScript yang ada ke TypeScript dan melanjutkan penerapan fungsi menggunakan kait pra-penerapan untuk mengubah kode sumber Anda. TypeScript menawarkan banyak manfaat dibandingkan vanilla JavaScript saat menulis fungsi:

  • TypeScript mendukung fitur JavaScript terbaru seperti async/menunggu, menyederhanakan manajemen janji
  • Linter Cloud Functions menyoroti masalah umum saat Anda melakukan coding
  • Keamanan jenis membantu Anda menghindari kesalahan waktu proses dalam fungsi yang diterapkan

Jika Anda baru mengenal 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 sampel di index.ts dan jalankan npm run serve untuk melihat fungsi "Hello World" beraksi.

Menggunakan proyek TypeScript yang ada

Jika Anda memiliki proyek TypeScript yang sudah ada, Anda dapat menambahkan kait pra-penerapan untuk memastikan proyek Anda ditranspilasikan setiap kali Anda menerapkan kode ke Cloud Functions for Firebase. Anda memerlukan file tsconfig.json yang dibentuk dengan benar dan proyek Firebase, dan Anda harus membuat 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 kait pra-penerapan untuk menjalankan skrip pembangunan. Sebagai contoh:

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

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

Memigrasikan proyek JavaScript yang ada ke TypeScript

Jika Anda memiliki proyek Cloud Functions yang telah Anda inisialisasi dan kembangkan dalam JavaScript, Anda dapat memigrasikannya ke TypeScript. Anda sangat dianjurkan untuk membuat git checkpoint atau cadangan lain sebelum memulai.

Untuk memigrasikan proyek JavaScript Cloud Functions yang 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 untuk bahasa untuk fungsi penulisan.
  3. Saat ditanya apakah akan menimpa file package.json yang ada, pilih No kecuali Anda yakin tidak ingin menyimpan file yang sudah ada.
  4. Hapus index.ts di direktori functions/src , ganti dengan kode sumber yang ada.
  5. Dalam file tsconfig.json yang dibuat saat inisialisasi, atur opsi kompiler untuk mengizinkan JavaScript: "allowJs": true .
  6. Salin file package.json Anda yang disimpan ke dalam direktori functions , dan edit untuk mengatur "main" menjadi "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 dalam Menjalankan fungsi secara lokal . Sangat penting untuk mengkompilasi kode Anda sebelum menggunakan alat ini, jadi pastikan untuk menjalankan npm run build di dalam direktori fungsi Anda sebelum menjalankan firebase emulators:start atau firebase functions:shell . Atau, jalankan npm run serve atau npm run shell sebagai jalan pintas; perintah ini menjalankan build dan melayani/memulai fungsi Shell.

Log fungsi untuk proyek TypeScript

Selama firebase deploy , index.ts proyek Anda ditranspilasikan ke 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 dalam IDE pilihan Anda atau melalui modul node .