Sử dụng TypeScript cho các chức năng đám mây

Đối với các nhà phát triển thích viết hàm trong TypeScript, Cloud Functions cung cấp hai loại hỗ trợ:

  • Tạo và định cấu hình các dự án TypeScript để dịch mã tự động khi khởi tạo ( firebase init functions ).
  • Chuyển mã nguồn TypeScript hiện có sang JavaScript tại thời điểm triển khai thông qua hook predeploy .

Làm theo hướng dẫn trong hướng dẫn này, bạn có thể di chuyển dự án JavaScript hiện có sang TypeScript và tiếp tục triển khai các hàm bằng cách sử dụng hook predeploy để dịch mã nguồn của mình. TypeScript mang lại nhiều lợi ích hơn so với JavaScript thông thường khi viết hàm:

  • TypeScript hỗ trợ các tính năng JavaScript mới nhất như async/await, đơn giản hóa việc quản lý lời hứa
  • Kẻ nói dối của Cloud Function nêu bật các vấn đề thường gặp khi bạn viết mã
  • An toàn loại giúp bạn tránh các lỗi thời gian chạy trong các hàm được triển khai

Nếu bạn chưa quen với TypeScript, hãy xem TypeScript sau 5 phút .

Khởi tạo dự án Chức năng đám mây mới với TypeScript

Chạy firebase init functions trong một thư mục mới. Công cụ này cung cấp cho bạn các tùy chọn để xây dựng dự án bằng JavaScript hoặc TypeScript. Chọn TypeScript để xuất cấu trúc dự án sau:

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

Sau khi quá trình khởi tạo hoàn tất, hãy bỏ ghi chú mẫu trong index.ts và chạy npm run serve để xem chức năng "Hello World" đang hoạt động.

Sử dụng dự án TypeScript hiện có

Nếu hiện có dự án TypeScript, bạn có thể thêm hook predeploy để đảm bảo dự án của bạn được dịch mã mỗi khi bạn triển khai mã của mình lên Cloud Functions cho Firebase. Bạn sẽ cần tệp tsconfig.json được định dạng chính xác và dự án Firebase, đồng thời bạn sẽ cần thực hiện các sửa đổi sau đối với cấu hình Firebase của mình:

  1. Chỉnh sửa package.json để thêm tập lệnh bash nhằm xây dựng dự án TypeScript của bạn. Ví dụ:

     {
       "name": "functions",
       "scripts": {
         "build": "npm run lint && tsc"
       }
     ...
    
  2. Chỉnh sửa firebase.json để thêm hook predeploy nhằm chạy tập lệnh xây dựng. Ví dụ:

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

Với cấu hình này, lệnh firebase deploy --only functions sẽ xây dựng mã TypeScript của bạn và triển khai nó dưới dạng hàm.

Di chuyển dự án JavaScript hiện có sang TypeScript

Nếu bạn có một dự án Chức năng đám mây hiện có mà bạn đã khởi tạo và phát triển bằng JavaScript, bạn có thể di chuyển nó sang TypeScript. Bạn được khuyến khích tạo điểm kiểm tra git hoặc bản sao lưu khác trước khi bắt đầu.

Để di chuyển dự án Chức năng đám mây JavaScript hiện có:

  1. Tạo điểm kiểm tra git và lưu bản sao của tệp nguồn JavaScript hiện có của bạn.
  2. Trong thư mục dự án, chạy firebase init functions và chọn TypeScript khi được nhắc về ngôn ngữ để viết các hàm.
  3. Khi được nhắc có ghi đè tệp package.json hiện có hay không, hãy chọn Không trừ khi bạn chắc chắn không muốn giữ lại tệp hiện có.
  4. Xóa index.ts trong thư mục functions/src , thay thế nó bằng mã nguồn hiện có của bạn.
  5. Trong tệp tsconfig.json được tạo khi khởi tạo, hãy đặt các tùy chọn trình biên dịch để cho phép JavaScript: "allowJs": true .
  6. Sao chép tệp package.json đã lưu của bạn vào thư mục functions và chỉnh sửa nó để đặt "main" thành "lib/index.js" .
  7. Ngoài ra, trong package.json , hãy thêm tập lệnh xây dựng cho TypeScript như sau:

     {
       "name": "functions",
       "scripts": {
         "build": "npm run lint && tsc"
       }
     ...
    
  8. Thêm "typescript" làm phần phụ thuộc của nhà phát triển bằng cách chạy npm install --save-dev typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser .

  9. Đối với tất cả các phần phụ thuộc, hãy chạy npm install --save @types/<dependency> .

  10. Viết lại mã nguồn từ .js sang .ts theo ý muốn.

Mô phỏng các hàm TypeScript

Để kiểm tra cục bộ các hàm TypeScript, bạn có thể sử dụng các công cụ mô phỏng được mô tả trong Chạy hàm cục bộ . Điều quan trọng là phải biên dịch mã của bạn trước khi sử dụng các công cụ này, vì vậy hãy đảm bảo chạy npm run build bên trong thư mục hàm của bạn trước khi chạy firebase emulators:start hoặc firebase functions:shell . Ngoài ra, hãy chạy npm run serve hoặc npm run shell làm phím tắt; các lệnh này đều chạy bản dựng và phục vụ/khởi động shell hàm.

Nhật ký chức năng cho các dự án TypeScript

Trong quá trình firebase deploy , index.ts của dự án của bạn được dịch mã thành index.js , nghĩa là nhật ký Chức năng đám mây sẽ xuất số dòng từ tệp index.js chứ không phải mã bạn đã viết. Để giúp bạn dễ dàng tìm thấy các đường dẫn và số dòng tương ứng trong index.ts , firebase deploy tạo functions/lib/index.js.map . Bạn có thể sử dụng bản đồ nguồn này trong IDE ưa thích của mình hoặc thông qua mô-đun nút .