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 các 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 để chuyển 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 triển khai trước .

Làm theo hướng dẫn trong hướng dẫn này, bạn có thể di chuyển một dự án JavaScript hiện có sang TypeScript và tiếp tục triển khai các chức năng bằng cách sử dụng móc nối triển khai trước để dịch mã nguồn của bạn. TypeScript mang lại nhiều lợi ích so với vanilla JavaScript khi viết các 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
  • Một kẻ nói dối về Chức năng đám mây làm nổi bật các vấn đề phổ biến trong khi bạn đang viết mã
  • Loại an toàn giúp bạn tránh lỗi thời gian chạy trong chức năng 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 bằng 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 "Xin chào thế giới" đang hoạt động.

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

Nếu bạn hiện có một dự án TypeScript, bạn có thể thêm móc nối triển khai trước để đả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 một tệp tsconfig.json được định dạng đúng và một 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 triển khai trước 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 xây dựng mã TypeScript của bạn và triển khai nó dưới dạng hàm.

Di chuyển một 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, thì bạn có thể di chuyển dự án đó sang TypeScript. Bạn nên tạo một điểm kiểm tra git hoặc bản sao lưu khác trước khi bắt đầu.

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

  1. Tạo một điểm kiểm tra git và lưu các bản sao của các 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 hàm.
  3. Khi được nhắc có ghi đè lên 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 tại của bạn.
  5. Trong tệp tsconfig.json được tạo khi khởi tạo, hãy đặt 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 tệp đó để đặt "main" thành "lib/index.js" .

  7. Cũng 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ụ thuộc, hãy chạy npm install --save @types/<dependency> .

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

Mô phỏng các chức năng TypeScript

Để kiểm tra các chức năng TypeScript cục bộ, bạn có thể sử dụng các công cụ mô phỏng được mô tả trong Chạy các chức năng 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, chạy npm run serve hoặc npm run shell như một phím tắt; cả hai lệnh này đều chạy bản dựng và phục vụ/khởi động trình bao chức năng.

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 chuyển mã thành index.js , nghĩa là nhật ký Hàm đá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 .