Cloud Functions için TypeScript kullanma

TypeScript'te işlev yazmayı tercih eden geliştiriciler için Cloud Functions iki tür destek sunar:

  • Başlatma sırasında (firebase init functions) otomatik çeviri için TypeScript projeleri oluşturun ve yapılandırın.
  • Predeploy kancası ile mevcut TypeScript kaynağını dağıtım sırasında JavaScript'e aktarın.

Bu kılavuzdaki talimatları uygulayarak mevcut bir JavaScript projesini TypeScript'e taşıyabilir ve kaynak kodunuzu derlemek için ön dağıtım kancası kullanarak işlevleri dağıtmaya devam edebilirsiniz. TypeScript, işlev yazarken normal JavaScript'e kıyasla birçok avantaj sunar:

  • TypeScript, async/await gibi en son JavaScript özelliklerini destekler ve promise yönetimini basitleştirir
  • Cloud Functions lint aracı, kodlama sırasında karşılaştığınız yaygın sorunları vurgular
  • Tür güvenliği, dağıtılan işlevlerde çalışma zamanındaki hataları önlemenize yardımcı olur

TypeScript'i kullanmaya yeni başladıysanız 5 dakikada TypeScript başlıklı makaleyi inceleyin.

TypeScript ile yeni bir Cloud Functions projesi başlatma

firebase init functions dosyasını yeni bir dizinde çalıştırın. Bu araç, projeyi JavaScript veya TypeScript ile oluşturma seçenekleri sunar. Şu çıktıyı almak için TypeScript'i seçin: şu proje yapısını uygulayın:

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

İlklendirme tamamlandıktan sonra index.ts dosyasında örneğin yorumunu kaldırın ve "Merhaba Dünya" işlevinin işleyişini görmek için npm run serve dosyasını çalıştırın.

Mevcut bir TypeScript projesini kullanma

Mevcut bir TypeScript projeniz varsa kodunuzu Cloud Functions for Firebase'e dağıttığınızda projenizin derlendiğinden emin olmak için bir dağıtım öncesi kanca ekleyebilirsiniz. Düzgün biçimlendirilmiş bir tsconfig.json dosyasına ve Firebase projesine ihtiyacınız vardır. Ayrıca Firebase yapılandırmanızda aşağıdaki değişiklikleri yapmanız gerekir:

  1. TypeScript projenizi derleyecek bir bash komut dosyası eklemek için package.json dosyasını düzenleyin. Örneğin:

     {
       "name": "functions",
       "scripts": {
         "build": "npm run lint && tsc"
       }
     ...
    
  2. Derleme komut dosyasını çalıştırmak için ön dağıtım kancası eklemek üzere firebase.json dosyasını düzenleyin. Örneğin:

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

Bu yapılandırmayla, firebase deploy --only functions komutu TypeScript kodunuzu oluşturur ve işlev olarak dağıtır.

Mevcut bir JavaScript projesini TypeScript'e taşıma

Başlattığınız mevcut bir Cloud Functions projeniz varsa ve JavaScript ile geliştirildiğinde, bu dosyayı TypeScript'i seçin. Başlamadan önce bir git kontrol noktası veya başka bir yedekleme oluşturmanız önemle tavsiye edilir.

Mevcut bir JavaScript Cloud Functions projesini taşımak için:

  1. Bir git kontrol noktası oluşturun ve mevcut JavaScript kaynak dosyalarınızın kopyalarını kaydedin.
  2. Proje dizininde, işlev yazmak için dil istendiğinde firebase init functions komutunu çalıştırın ve TypeScript öğesini seçin.
  3. Mevcut package.json dosyasının üzerine yazılıp yazılmayacağı sorulduğunda, mevcut dosyayı tutmak istemediğinizden emin değilseniz Hayır'ı seçin.
  4. functions/src dizinindeki index.ts dosyasını mevcut kaynak kodunuzla değiştirerek silin.
  5. Başlatma sırasında oluşturulan tsconfig.json dosyasında derleyici seçeneklerini JavaScript'e izin verecek şekilde ayarlayın: "allowJs": true.
  6. Kayıtlı package.json dosyanızı functions dizinine kopyalayın ve "main" değerini "lib/index.js" olarak ayarlayacak şekilde düzenleyin.
  7. Ayrıca, package.json içinde, TypeScript için aşağıdaki gibi bir derleme komut dosyası ekleyin:

     {
       "name": "functions",
       "scripts": {
         "build": "npm run lint && tsc"
       }
     ...
    
  8. npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser'u çalıştırarak "typescript"'ü geliştirme bağımlılığı olarak ekleyin.

  9. Tüm bağımlılıklar için npm install --save @types/<dependency> komutunu çalıştırın.

  10. Kaynak kodunu .js'den .ts'ye istediğiniz şekilde yeniden yazın.

TypeScript işlevleri emülasyonu

TypeScript işlevlerini yerel olarak test etmek için aşağıda açıklanan emülasyon araçlarını kullanabilirsiniz: İşlevleri yerel olarak çalıştırma konusunu inceleyin. Bu araçları kullanmadan önce kodunuzu derlemeniz önemlidir. Bu nedenle, firebase emulators:start veya firebase functions:shell'yi çalıştırmadan önce işlev dizininizde npm run build'yi çalıştırdığınızdan emin olun. Alternatif olarak, kısayol olarak npm run serve veya npm run shell komutunu çalıştırın. Bu komutlar hem derlemeyi çalıştırır hem de işlev kabuğunu sunar/başlatır.

TypeScript projeleri için işlev günlükleri

firebase deploy sırasında projenizin index.ts dosyası index.js dosyasına dönüştürülür. Bu, Cloud Functions günlüğünde yazdığınız kod yerine index.js dosyasının satır numaralarının gösterileceği anlamına gelir. Verilerinizi bulmanızı kolaylaştırmak için index.ts içerisindeki karşılık gelen yollar ve satır numaraları, firebase deploy, functions/lib/index.js.map öğesini oluşturur. Bu kaynak haritasını tercih ettiğiniz IDE'de veya bir düğüm modülü aracılığıyla kullanabilirsiniz.