Catch up on everything announced at Firebase Summit, and learn how Firebase can help you accelerate app development and run your app with confidence. Learn More

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

Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.

Đố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à cấu hình các dự án TypeScript để tự động chuyển đổi khi khởi tạo ( firebase init functions ).
  • Chuyển nguồn TypeScript hiện có sang JavaScript tại thời điểm triển khai thông qua một móc 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 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 triển khai trước để chuyển mã nguồn của bạn. TypeScript cung cấp nhiều lợi ích hơn JavaScript vani 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 trình kết nối Chức năng đám mây nêu bật các sự cố thường gặp trong khi bạn viết mã
  • Nhập an toàn giúp bạn tránh lỗi thời gian chạy trong các 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 với TypeScript

Chạy firebase init functions trong một thư mục mới. Công cụ 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 ra 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 khởi tạo xong, 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 một dự án TypeScript hiện có

Nếu bạn có một dự án TypeScript hiện tại, bạn có thể thêm một hook trước khi triển khai để đảm bảo rằng dự án của bạn được chuyển mỗi khi bạn triển khai mã của mình cho Cloud Functions cho Firebase. Bạn sẽ cần tệp tsconfig.json được định dạng đúng 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 để 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 móc triển khai trước để 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 các 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 tại mà bạn đã khởi tạo và phát triển bằng JavaScript, bạn có thể chuyển nó sang TypeScript. Bạn được khuyến khích tạo một trạm kiểm soát git hoặc một bản sao lưu khác trước khi bắt đầu.

Để di chuyển một dự án JavaScript Cloud Functions hiện có:

  1. Tạo điểm kiểm tra git và lưu 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, hãy chạy firebase init functions và chọn TypeScript khi được nhắc về một ngôn ngữ để viết các 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 rằng mình không muốn giữ 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. Cũng trong package.json , hãy thêm một 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 thành .ts như mong muốn.

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

Để kiểm tra cục bộ các chức năng của TypeScript, 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 chức năng 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ác lệnh này đều chạy bản dựng và phục vụ / khởi động trình bao 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 chuyển sang index.js , có nghĩa là nhật ký Chức năng đám mây sẽ xuất số dòng từ 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 .