Cloud Functions için TypeScript kullanma

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

  • Başlatma sırasında otomatik çeviri için TypeScript projeleri oluşturma ve yapılandırma (firebase init functions)
  • Mevcut TypeScript kaynağını, dağıtım sırasında bir dağıtım öncesi kancası aracılığıyla JavaScript'e çevirin.

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

  • TypeScript, async/await gibi en yeni JavaScript özelliklerini destekleyerek Promise yönetimini basitleştirir.
  • Cloud Functions linter, kod yazarken sık karşılaşılan sorunları vurgular
  • Tip güvenliği, dağıtılan işlevlerde çalışma zamanı hatalarını önlemenize yardımcı olur.

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

TypeScript ile yeni bir Cloud Functions projesi başlatma

firebase init functions komutunu yeni bir dizinde çalıştırın. Araç, projeyi JavaScript veya TypeScript ile oluşturma seçenekleri sunar. Aşağıdaki proje yapısını oluşturmak için TypeScript'i seçin:

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

Başlatma işlemi tamamlandıktan sonra index.ts dosyasındaki örneğin açıklama satırı işaretini kaldırın ve "Hello World" işlevini çalışırken görmek için npm run serve komutunu çalıştırın.

Mevcut bir TypeScript projesini kullanma

Mevcut bir TypeScript projeniz varsa kodunuzu Cloud Functions for Firebase platformuna her dağıttığınızda projenizin çevrildiğinden emin olmak için bir dağıtım öncesi kancası 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 derlemek için bir bash komut dosyası eklemek üzere 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 predeploy 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 derler ve işlev olarak dağıtır.

Mevcut bir JavaScript projesini TypeScript'e taşıma

JavaScript'te başlattığınız ve geliştirdiğiniz mevcut bir Cloud Functions projeniz varsa bunu TypeScript'e taşıyabilirsiniz. Başlamadan önce bir git kontrol noktası veya başka bir yedek 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 firebase init functions komutunu çalıştırın ve işlevleri yazmak için dil seçmeniz istendiğinde TypeScript seçeneğini belirleyin.
  3. Mevcut package.json dosyasının üzerine yazılıp yazılmayacağı sorulduğunda, mevcut dosyayı saklamak istemediğinizden emin değilseniz Hayır'ı seçin.
  4. functions/src dizinindeki index.ts dosyasını silip mevcut kaynak kodunuzla değiştirin.
  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. Kaydedilen package.json dosyanızı functions dizinine kopyalayın ve "main" değerini "lib/index.js" olarak ayarlamak için dosyayı düzenleyin.

  7. Ayrıca package.json dosyasına 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 komutunu çalıştırarak "typescript" paketini 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 gibi yeniden yazın.

TypeScript işlevlerini emüle etme

TypeScript işlevlerini yerel olarak test etmek için İşlevleri yerel olarak çalıştırma bölümünde açıklanan emülasyon araçlarını kullanabilirsiniz. Bu araçları kullanmadan önce kodunuzu derlemeniz önemlidir. Bu nedenle, firebase emulators:start veya firebase functions:shell komutunu çalıştırmadan önce functions dizininizde npm run build komutunu ç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ın ikisi de derlemeyi çalıştırır ve işlevler kabuğunu sunar/başlatır.

TypeScript projeleri için Functions günlükleri

firebase deploy sırasında projenizin index.ts dosyası index.js dosyasına çevrilir. Bu nedenle, Cloud Functions günlüğünde yazdığınız kodun değil, index.js dosyasının satır numaraları gösterilir. index.ts uygulamasında ilgili yolları ve satır numaralarını daha kolay bulabilmeniz için firebase deploy, functions/lib/index.js.map oluşturur. Bu kaynak eşlemeyi tercih ettiğiniz IDE'de veya bir düğüm modülü aracılığıyla kullanabilirsiniz.