在 Cloud Functions 中使用 TypeScript

对于希望使用 TypeScript 编写函数的开发者,Cloud Functions 提供了两种支持方案:

  • 创建并配置 TypeScript 项目,然后在初始化 (firebase init functions) 时自动进行转译。
  • 利用部署前钩子在部署时将现有 TypeScript 源代码转译为 JavaScript。

按照本指南中的说明,您可以将现有 JavaScript 项目迁移至 TypeScript,并使用部署前钩子来转译源代码,以继续部署函数。就编写函数而言,TypeScript 相比原版 JavaScript 有诸多优势:

  • TypeScript 支持最新的 JavaScript 功能(例如 async/await),简化了 promise 管理
  • 您编写代码时,Cloud Functions linter 会标出一些常见问题
  • 类型安全性有助于避免所部署的函数中的运行时错误

如需以 TypeScript 编写的可运行 Cloud Functions 函数示例,请参阅我们的 GitHub 代码库中的 typescript-getting-started

使用 TypeScript 初始化一个全新 Cloud Functions 项目

在一个新目录中运行 firebase init。该工具会提供选项,让您选择是使用 JavaScript 还是 TypeScript 来构建项目。选择 TypeScript 可输出以下项目结构:

myproject
 +- functions/     # Directory containing all your functions code
      |
      +- package.json  # npm package file describing your Cloud Functions code
      |
      +- tsconfig.json
      |
      +- tslint.json # Optional file
      |
      +- 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

使用现有的 TypeScript 项目

对于现有的 TypeScript 项目,您可以添加部署前钩子,以确保每次将代码部署到 Cloud Functions for Firebase 时都对项目进行转译。您需要一个格式正确的 tsconfig.json 文件和一个 Firebase 项目,并且需要对您的 Firebase 配置进行以下修改:

  1. 修改 package.json 以添加一个 bash 脚本来编译您的 TypeScript 项目。例如:

     {
       "name": "functions",
       "scripts": {
         "build": "./node_modules/.bin/tslint -p tslint.json && ./node_modules/.bin/tsc"
       }
     ...
    
  2. 修改 firebase.json 以添加一个部署前钩子来运行编译脚本。例如:

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

进行此配置后,firebase deploy --only functions 命令即会编译 TypeScript 代码并将其部署为函数。

将现有的 JavaScript 项目迁移到 TypeScript

如果您有一个使用 JavaScript 初始化和开发的现有 Cloud Functions 项目,可以将其迁移到 TypeScript。强烈建议您在开始之前创建一个 git 检查点或以其他方式进行备份。

要迁移现有的 JavaScript Cloud Functions 项目,请执行以下操作:

  1. 创建一个 git 检查点并保存现有 JavaScript 源代码文件的副本。
  2. 在项目目录中,运行 firebase init functions 并在系统提示选择用于编写函数的语言时选择 TypeScript
  3. 除非您确定不再需要保留现有文件,否则当系统提示是否覆盖现有 package.json 文件时,请选择 No
  4. 删除目录 functions/src 中的 index.ts,将其替换为现有的源代码。
  5. 在初始化时创建的 tsconfig.json 文件中,设置编译器选项以允许使用 JavaScript:"allowJs": "true"
  6. 将保存的 package.json 文件复制到 functions 目录中,并对其进行修改以将 "main" 设置为 "lib/index.js"
  7. 同样在 package.json 中,为 TypeScript 添加一个与下面的示例类似的编译脚本:

     {
       "name": "functions",
       "scripts": {
         "build": "./node_modules/.bin/tslint --project tsconfig.json && ./node_modules/.bin/tsc"
       }
     ...
    
  8. 通过运行 npm install --save --only=dev typescript 来添加 "typescript" 作为开发依赖项。

  9. 对于所有依赖项,运行 npm install --save @types/<dependency>

  10. 根据需要将源代码从 .js 重写为 .ts。

TypeScript 项目的 Functions 日志

firebase deploy 期间,您的项目的 index.ts 将被转译为 index.js,也就是说,Cloud Functions 日志将输出 index.js 文件中的行号,而非您编写的代码。为了让您更方便地找到 index.ts 中对应的路径和行号,firebase deploy 会创建 functions/lib/index.js.map。您可以在您偏好的 IDE 中或通过节点模块使用此源代码映射文件。

发送以下问题的反馈:

此网页
需要帮助?请访问我们的支持页面