สำหรับนักพัฒนาที่ต้องการเขียนฟังก์ชันใน TypeScript ฟังก์ชันคลาวด์จะให้การสนับสนุนสองประเภท:
- สร้างและกำหนดค่าโปรเจ็กต์ TypeScript สำหรับการทรานสพิลอัตโนมัติเมื่อเริ่มต้น (
firebase init functions
) - Transpile ต้นฉบับ TypeScript ที่มีอยู่เป็น JavaScript ในเวลาปรับใช้ผ่าน hook ที่ติดตั้งไว้ล่วงหน้า
ทำตามคำแนะนำในคู่มือนี้ คุณสามารถย้ายโปรเจ็กต์ JavaScript ที่มีอยู่ไปยัง TypeScript และปรับใช้ฟังก์ชันต่อไปได้โดยใช้ฮุกที่ปรับใช้ล่วงหน้าเพื่อแปลงซอร์สโค้ดของคุณ TypeScript นำเสนอข้อดีมากมายเหนือ JavaScript วานิลลาเมื่อเขียนฟังก์ชัน:
- TypeScript รองรับฟีเจอร์ JavaScript ล่าสุด เช่น async/await ทำให้การจัดการสัญญาง่ายขึ้น
- ส่วน 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 ดังต่อไปนี้
แก้ไข
package.json
เพื่อเพิ่มสคริปต์ทุบตีเพื่อสร้างโปรเจ็กต์ TypeScript ของคุณ ตัวอย่างเช่น:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
แก้ไข
firebase.json
เพื่อเพิ่ม hook ที่ปรับใช้ล่วงหน้าเพื่อเรียกใช้สคริปต์บิลด์ ตัวอย่างเช่น:{ "functions": { "predeploy": "npm --prefix functions run build", } }
ด้วยการกำหนดค่านี้ คำสั่ง firebase deploy --only functions
จะสร้างโค้ด TypeScript ของคุณและปรับใช้เป็นฟังก์ชัน
การย้ายโครงการ JavaScript ที่มีอยู่ไปยัง TypeScript
หากคุณมีโปรเจ็กต์ Cloud Functions ที่คุณเริ่มต้นและพัฒนาใน JavaScript อยู่แล้ว คุณจะย้ายโปรเจ็กต์ดังกล่าวไปยัง TypeScript ได้ ขอแนะนำอย่างยิ่งให้คุณสร้างจุดตรวจสอบคอมไพล์หรือข้อมูลสำรองอื่นๆ ก่อนเริ่มต้น
หากต้องการย้ายโปรเจ็กต์ JavaScript Cloud Functions ที่มีอยู่ ให้ทำดังนี้
- สร้างจุดตรวจสอบ Git และบันทึกสำเนาของไฟล์ต้นฉบับ JavaScript ที่มีอยู่
- ในไดเร็กทอรีโปรเจ็กต์ ให้เรียกใช้
firebase init functions
และเลือกTypeScript
เมื่อได้รับแจ้งให้ระบุภาษาสำหรับเขียนฟังก์ชัน - เมื่อได้รับแจ้งว่าจะเขียนทับไฟล์
package.json
ที่มีอยู่หรือไม่ ให้เลือก No เว้นแต่คุณแน่ใจว่าคุณไม่ต้องการเก็บไฟล์ที่มีอยู่ - ลบ
index.ts
ในไดเร็กทอรีfunctions/src
โดยแทนที่ด้วยซอร์สโค้ดที่มีอยู่ - ในไฟล์
tsconfig.json
ที่สร้างขึ้นเมื่อเริ่มต้น ให้ตั้งค่าตัวเลือกคอมไพลเลอร์เพื่ออนุญาต JavaScript:"allowJs": true
- คัดลอกไฟล์
package.json
ที่บันทึกไว้ของคุณลงในไดเรกทอรีfunctions
และแก้ไขเพื่อตั้งค่า"main"
เป็น"lib/index.js"
นอกจากนี้ใน
package.json
ให้เพิ่มสคริปต์บิลด์สำหรับ TypeScript ดังต่อไปนี้:{ "name": "functions", "scripts": { "build": "npm run lint && tsc" } ...
เพิ่ม
"typescript"
เป็นการพึ่งพา dev โดยการรันnpm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser
สำหรับการขึ้นต่อกันทั้งหมด ให้รัน
npm install --save @types/<dependency>
เขียนซอร์สโค้ดใหม่จาก .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 ที่คุณต้องการหรือผ่าน โมดูลโหนด