ใช้ TypeScript สำหรับ Cloud Functions

สำหรับนักพัฒนาซอฟต์แวร์ที่ต้องการเขียนฟังก์ชันใน TypeScript Cloud Functions ให้การสนับสนุน 2 ประเภทดังนี้

• สร้างและกำหนดค่าโปรเจ็กต์ TypeScript สำหรับการแปลงอัตโนมัติเมื่อเริ่มต้น (firebase init functions)
• เปลี่ยนรูปแบบคำสั่ง TypeScript ที่มีอยู่เป็น JavaScript ในเวลาที่มีการทำให้ใช้งานได้ผ่าน Hook ที่ทำให้ใช้งานได้ล่วงหน้า

โดยทำตามคำแนะนำในคู่มือนี้ คุณสามารถย้ายข้อมูล โปรเจ็กต์ JavaScript ไปยัง TypeScript และทำให้ฟังก์ชันใช้งานได้ต่อไปโดยใช้ ติดตั้งใช้งาน Hook เพื่อเปลี่ยนรูปแบบซอร์สโค้ด TypeScript มีประโยชน์หลายอย่างเหนือกว่า JavaScript ธรรมดาเมื่อเขียนฟังก์ชัน ดังนี้

• TypeScript รองรับฟีเจอร์ล่าสุดของ JavaScript เช่น async/await ซึ่งช่วยให้การจัดการ Promise ง่ายขึ้น
• โปรแกรมตรวจสอบไวยากรณ์ Cloud Functions จะไฮไลต์ปัญหาที่พบบ่อยขณะที่คุณเขียนโค้ด
• ความปลอดภัยตามประเภทช่วยให้คุณหลีกเลี่ยงข้อผิดพลาดรันไทม์ในฟังก์ชันที่ทำให้ใช้งานได้

หากเพิ่งเริ่มใช้ TypeScript โปรดดูTypeScript ใน 5 นาที

เริ่มต้นโปรเจ็กต์ Cloud Functions ใหม่ด้วย TypeScript

เรียกใช้ firebase init functions ในไดเรกทอรีใหม่ เครื่องมือนี้มีตัวเลือกที่ให้คุณสร้าง ด้วย JavaScript หรือ TypeScript เลือก TypeScript เพื่อเอาต์พุต โครงสร้างโปรเจ็กต์ต่อไปนี้

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

เมื่อการเริ่มต้นเสร็จสมบูรณ์แล้ว ให้ยกเลิกการคอมเมนต์ตัวอย่างใน index.ts แล้วเรียกใช้ npm run serve เพื่อดูการทำงานของฟังก์ชัน "Hello World"

การใช้โปรเจ็กต์ TypeScript ที่มีอยู่

หากมีโปรเจ็กต์ TypeScript อยู่แล้ว คุณสามารถเพิ่มฮุกก่อนการทําให้ใช้งานได้เพื่อตรวจสอบว่าโปรเจ็กต์ได้รับการแปลงทุกครั้งที่คุณทําให้โค้ดใช้งานได้ใน Cloud Functions for Firebase คุณจะต้องมีไฟล์ tsconfig.json ที่จัดรูปแบบอย่างถูกต้องและโปรเจ็กต์ Firebase รวมถึงต้องทำการแก้ไขต่อไปนี้ในการกําหนดค่า Firebase

1. แก้ไข package.json เพื่อเพิ่มสคริปต์ Bash เพื่อสร้างโปรเจ็กต์ TypeScript เช่น

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

2. แก้ไข firebase.json เพื่อเพิ่มฮุกการก่อนการเผยแพร่เพื่อเรียกใช้สคริปต์บิลด์ เช่น

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

เมื่อใช้การกำหนดค่านี้ คำสั่ง firebase deploy --only functions สร้างโค้ด TypeScript ของคุณและทำให้เป็นฟังก์ชัน

การย้ายข้อมูลโปรเจ็กต์ JavaScript ที่มีอยู่ไปยัง TypeScript

หากคุณมีโปรเจ็กต์ Cloud Functions เดิมที่คุณได้เริ่มต้นไว้แล้ว ซึ่งได้รับการพัฒนาใน JavaScript คุณสามารถย้ายข้อมูลเข้าสู่ TypeScript คุณควรสร้างจุดตรวจ git หรือ ข้อมูลสํารองก่อนเริ่มต้น

วิธีย้ายข้อมูลโปรเจ็กต์ JavaScript Cloud Functions ที่มีอยู่

1. สร้างจุดตรวจสอบ Git และบันทึกสําเนาของไฟล์ต้นฉบับ JavaScript ที่มีอยู่
2. ในไดเรกทอรีของโปรเจ็กต์ ให้เรียกใช้ firebase init functions และเลือก TypeScript เมื่อระบบแจ้งให้ระบุภาษาสำหรับฟังก์ชันการเขียน
3. เมื่อได้รับข้อความแจ้งว่าจะเขียนทับไฟล์ package.json ที่มีอยู่หรือไม่ ให้เลือกไม่ เว้นแต่คุณแน่ใจว่าไม่ต้องการเก็บไฟล์ที่มีอยู่
4. ลบ index.ts ในไดเรกทอรี functions/src แทนที่ด้วยซอร์สโค้ดที่มีอยู่
5. ในไฟล์ tsconfig.json ที่สร้างขึ้นในตอนเริ่มต้น ให้ตั้งค่าตัวเลือกคอมไพเลอร์เพื่ออนุญาต JavaScript: "allowJs": true
6. คัดลอกไฟล์ package.json ที่บันทึกไว้ลงในไดเรกทอรี functions และแก้ไขเพื่อตั้งค่า "main" เป็น "lib/index.js"

7. ใน package.json ให้เพิ่มสคริปต์บิลด์สำหรับ TypeScript ดังนี้

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

8. เพิ่ม "typescript" เป็นทรัพยากร Dependency สำหรับนักพัฒนาซอฟต์แวร์ด้วยการเรียกใช้ npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser

9. สำหรับทรัพยากร Dependency ทั้งหมด ให้เรียกใช้ npm install --save @types/<dependency>

10. เขียนซอร์สโค้ดจาก .js เป็น .ts ใหม่ตามต้องการ

การจําลองฟังก์ชัน TypeScript

หากต้องการทดสอบฟังก์ชัน TypeScript ในเครื่อง ให้ใช้เครื่องมือจําลองที่อธิบายไว้ในเรียกใช้ฟังก์ชันในเครื่อง คุณต้อง คอมไพล์โค้ดก่อนใช้เครื่องมือเหล่านี้ ดังนั้นอย่าลืมเรียกใช้ npm run build ภายในไดเรกทอรีฟังก์ชันก่อนที่จะเรียกใช้ firebase emulators:start หรือ firebase functions:shell หรือเรียกใช้ npm run serve หรือ npm run shell เป็นทางลัดก็ได้ คำสั่งเหล่านี้จะเรียกใช้ทั้งบิลด์และแสดง/เริ่มเชลล์ฟังก์ชัน

บันทึกฟังก์ชันสำหรับโปรเจ็กต์ TypeScript

ในระหว่าง firebase deploy ระบบจะแปลง index.ts ของโปรเจ็กต์เป็น index.js ซึ่งหมายความว่าบันทึก Cloud Functions จะแสดงผลหมายเลขบรรทัดจาก index.js ไม่ใช่โค้ดที่คุณเขียน เพื่อให้คุณค้นหา เส้นทางและหมายเลขบรรทัดที่เกี่ยวข้องใน index.ts firebase deploy สร้าง functions/lib/index.js.map คุณใช้แหล่งข้อมูลนี้ได้ แมปใน IDE ที่ต้องการหรือผ่านโมดูลโหนด